Ngike ngaba seqophelweni eliphezulu isikhathi eside ngokwanele ukuze ngibone ithrendi phakathi neminyaka edlule: onjiniyela abancane basebenza nge-paradigm entsha yokuhlela ngaphandle kokuqonda umongo wayo womlando. Yiqiniso, kuqondakala ngokuphelele ukungazi okuthile. Iwebhu iyindawo enkulu kakhulu enamakhono ahlukahlukene kanye nezipesheli, futhi asihlali sazi esingakwazi. Ukufunda kulo mkhakha kuwuhambo oluqhubekayo kunokuba into eyenzekayo kanye futhi iphele. Indaba: Othile eqenjini lami ubuze ukuthi kungenzeka yini ukusho uma abasebenzisi bezulazula besuka kuthebhu ethile ku-UI. Ngikhombe umcimbi weJavaScript ngaphambi kokulayisha. Kodwa labo abake babhekana nalokhu ngaphambili bayazi ukuthi lokhu kungenzeka ngoba bahlaselwe izexwayiso mayelana nedatha engalondoloziwe kwamanye amasayithi, okuyicala elivamile lokusebenzisa ngaphambi kokukhipha. Ngiphinde ngikhombe ikhasiFihla kanye nokubonakalaShintsha izehlakalo kozakwethu ngesilinganiso esihle. Ngangazi kanjani ngalokho? Ngoba ivele kwenye iphrojekthi, hhayi ngoba ngifunde ngayo lapho ngiqala ukufunda i-JavaScript. Iqiniso liwukuthi izinhlaka zangaphambili zesimanje zimi emahlombe obhazabhaza bezobuchwepheshe obandulelayo. Ziyizinqubo zokuthuthukiswa ezingabonakali, ngokuvamile okokuzizwisa konjiniyela okungcono kakhulu okunciphisa, noma ngisho nokuqeda, isidingo sokwazi noma ukuthinta lokho obekukade kuyimiqondo ephambili ebalulekile wonke umuntu okungenzeka ukuthi uyazi. Cabanga nge-CSS Object Model (CSSOM). Ungalindela ukuthi noma ngubani osebenza ku-CSS naku-JavaScript unenqwaba yesipiliyoni se-CSSOM, kodwa lokho ngeke kuhlale kunjalo. Kube nephrojekthi ye-React yesayithi ye-e-commerce engisebenze kuyo lapho besidinga ukulayisha ishidi lesitayela lomhlinzeki wokukhokha okhethiwe njengamanje. Inkinga yayiwukuthi ishidi lesitayela lalilayisha kuwo wonke amakhasi lapho lalidingeka kuphela ekhasini elithile. Unjiniyela onikezwe umsebenzi wokwenza lokhu ubengakaze alayishe ishidi lesitayela ngendlela eguqukayo. Futhi, lokhu kuqondakala ngokuphelele lapho i-React isusa indlela evamile ongase ufinyelele kuyo. I-CSSOM cishe akuyona into oyidingayo emsebenzini wakho wansuku zonke. Kodwa kungenzeka ukuthi uzodinga ukuxhumana nayo ngesikhathi esithile, ngisho nangesikhathi esisodwa. Lokhu okuhlangenwe nakho kwangikhuthaza ukuba ngibhale lesi sihloko. Ziningi izici zewebhu ezikhona kanye nobuchwepheshe endle ongeke neze uzithinte ngokuqondile emsebenzini wakho wansuku zonke. Mhlawumbe umusha ekuthuthukisweni kwewebhu futhi awuzazi ngoba ucwile ekuthathweni kohlaka oluthile olungadingi ukuthi wazi ngokujulile, noma nhlobo. Ngikhuluma ngqo nge-XML, abaningi bethu abazi ukuthi iwulimi lwakudala olungahluke ngokuphelele ku-HTML. Ngiveza lokhu ngenxa yezingxoxo zakamuva ze-WHATWG eziphakamisa ukuthi ingxenye ebalulekile yesitaki se-XML eyaziwa ngokuthi uhlelo lwe-XSLT kufanele isuswe kuziphequluli. Lona kanye uhlobo lobuchwepheshe obudala, obukhona esibe nabo iminyaka obungasetshenziselwa okuthile okuwusizo njengesimo se-CSSOM iqembu lami elalikuso. Uke wasebenza nge-XSLT ngaphambilini? Ake sibone ukuthi ingabe sincika kakhulu kulobu buchwepheshe obudala futhi sisebenzise izici zabo ngaphandle komongo we-XML ukuze sibhekane nezinkinga zomhlaba wangempela namuhla. I-XPath: I-API Emaphakathi Ubuchwepheshe be-XML obubaluleke kakhulu okungenzeka ukuthi buwusizo kakhulu ngaphandle kombono we-XML oqondile yi-XPath, ulimi lombuzo olukuvumela ukuthi uthole noma iyiphi i-node noma isibaluli esihlahleni somaka esinempande eyodwa. Nginothando lomuntu siqu nge-XSLT, kodwa lokho futhi kuncike ku-XPath, futhi uthando lomuntu siqu kufanele lubekwe eceleni ngokubaluleka kwezinga. I-agumenti yokukhipha i-XSLT ayisho lutho nge-XPath, ngakho-ke ngicabanga ukuthi isavunyelwe. Kuhle lokho ngoba i-XPath iyi-API emaphakathi nebaluleke kakhulu kulolu chungechunge lobuchwepheshe, ikakhulukazi lapho uzama ukuthola okuthile ongakusebenzisa ngaphandle kokusetshenziswa okujwayelekile kwe-XML. Kubalulekile ngoba, ngenkathi izikhethi ze-CSS zingasetshenziswa ukuthola izinto eziningi ekhasini lakho, azikwazi ukuzithola zonke. Ngaphezu kwalokho, izikhethi ze-CSS azikwazi ukusetshenziselwa ukuthola into ngokusekelwe endaweni yayo yamanje ku-DOM. I-XPath can. Manje, abanye benu abafunda lokhu bangase bazi i-XPath, kanti abanye bangase bangayazi. I-XPath iyindawo enkulu kakhulu yobuchwepheshe, futhi angikwazi ngempela ukufundisa zonke izisekelo futhi ngikubonise izinto ezinhle ongayenza ngayo esihlokweni esisodwa esifana nalesi. Empeleni ngizamile ukubhala leso sihloko, kodwa isilinganiso sokushicilelwa kwe-Smashing Magazine akuhambi ngaphezu kwamagama angu-5,000. Bengivele ngingaphezu kukaAmagama angu-2,000 ngenkathi uphakathi kwezisekelo. Ngakho-ke, ngizoqala ukwenza izinto ezinhle nge-XPath futhi ngikunike izixhumanisi ongazisebenzisela okuyisisekelo uma uthola lezi zinto ezithakazelisayo. Ihlanganisa i-XPath ne-CSS I-XPath ingenza izinto eziningi abakhethi be-CSS abangakwazi ukuzenza lapho bebuza ngezinto. Kodwa abakhethi be-CSS bangakwazi nokwenza izinto ezimbalwa i-XPath engakwazi, okungukuthi, izici zokubuza ngamagama ekilasi.

CSS I-XPath .myClass /*[iqukethe(@class, "myClass")]

Kulesi sibonelo, izakhi zemibuzo ze-CSS eziqukethe igama lekilasi elithi .myClass. Ngaleso sikhathi, isibonelo se-XPath sibuza izici eziqukethe isigaba sesibaluli esinochungechunge oluthi “myClass”. Ngamanye amazwi, ikhetha ama-elementi ane-myClass kunoma yisiphi isibaluli, okuhlanganisa izici ezinegama lekilasi elithi .myClass — kanye nama-elementi ane-“myClass” kuyunithi yezinhlamvu, njenge-.myClass2. I-XPath ibanzi ngalowo mqondo. Ngakho, cha. Angiphakamisi ukuthi kufanele sikhiphe i-CSS futhi siqale ukukhetha zonke izakhi nge-XPath. Akulona iphuzu. Iphuzu liwukuthi i-XPath ingenza izinto i-CSS engakwazi futhi isengaba usizo kakhulu, nakuba kuwubuchwepheshe obudala kusitaki sesiphequluli futhi ingase ingabonakali sobala ekuqaleni. Masisebenzise lobu buchwepheshe obubili ndawonye hhayi nje ngoba singakwazi, kodwa ngoba sizofunda okuthile mayelana ne-XPath ngesikhathi, siyenze ibe elinye ithuluzi kusitaki sakho - okungenzeka ubungazi ukuthi belikhona sonke lesi sikhathi! Inkinga ukuthi indlela ye-JavaScript's document.evaluate nezindlela ezihlukahlukene zokukhetha imibuzo esizisebenzisayo nama-CSS API we-JavaScript akuhambisani. Ngenze i-API yokubuza ehambisanayo ukuze isiqalise, nakuba kuyavunywa, angizange ngibeke umcabango omningi kuyo njengoba kuwukusuka kulokho esikwenzayo lapha. Nasi isibonelo esilula sokusebenza somakhi wombuzo ongasebenziseka kabusha: Bona umbuzo wePeniXPath [owenziwe ngemfoloko] nguBryan Rasmussen. Ngingeze izindlela ezimbili entweni yedokhumenti: queryCSSSelectors (okuyinto empeleni i-querySelectorAll) kanye ne-queryXPaths. Zombili lezi zibuyisela into ye-queryResuls:

{ uhlobo lombuzo: amanodi | umucu | inombolo | i-boolean, imiphumela: noma yiziphi[] // izakhi ze-html, izakhi ze-xml, izintambo, izinombolo, ama-booleans, queryCSSSelectors: (umbuzo: string, chibiyela: boolean) => queryResults, queryXpaths: (umbuzo: string, chibiyela: boolean) => queryResults }

I-queryCSSSelectors nemisebenzi ye-queryXpaths isebenzisa umbuzo owunikeza yona phezu kwezinto ezikuhlu lwemiphumela, inqobo nje uma uhlu lwemiphumela lungohlobo lwamanodi, kunjalo. Uma kungenjalo, izobuyisela umbuzoUmphumela onamalungu afanayo angenalutho kanye nohlobo lwamanodi. Uma isakhiwo sokuchibiyela sisethelwe kuqiniso, imisebenzi izoshintsha eyayo imibuzo Imiphumela. Akufanele lokhu kusetshenziswe ngaphansi kwezimo endaweni yokukhiqiza. Ngikwenza ngale ndlela ukuze ngibonise imiphumela ehlukahlukene yokusebenzisa ama-API wemibuzo emibili ndawonye. Isibonelo semibuzo Ngifuna ukukhombisa izibonelo ezimbalwa zemibuzo ehlukene ye-XPath ebonisa ezinye zezinto ezinamandla abangakwazi ukuzenza nokuthi zingasetshenziswa kanjani esikhundleni sezinye izindlela. Isibonelo sokuqala ngu//li/text(). Lokhu kubuza zonke izici ze-li futhi kubuyisela izindawo zazo zombhalo. Ngakho-ke, uma besizobuza i-HTML elandelayo:

  • eyodwa
  • okubili
  • ezintathu

...nakhu okubuyiswayo:

{"queryType":"xpathEvaluate","results":["one","two","three"],"resultType":"string"}

Ngamanye amazwi, sithola uhlu olulandelayo: ["okukodwa","kubili","ntathu"]. Ngokujwayelekile, ungabuza ukuthi ama-elementi e-li athole lokho, phendula umphumela walowo mbuzo wenze amalungu afanayo, yenza imephu yamalungu afanayo, bese ubuyisela inodi yombhalo yento ngayinye. Kepha singakwenza lokho kafushane nge-XPath: document.queryXPaths("//li/text()").imiphumela.

Qaphela ukuthi indlela yokuthola inodi yombhalo ukusebenzisa umbhalo(), obukeka njengesiginesha yomsebenzi - futhi kunjalo. Ibuyisela inodi yombhalo ye-elementi. Esibonelweni sethu, kunezici ezintathu zama-li kumakhaphu, ngayinye iqukethe umbhalo ("okukodwa", "okubili", kanye "nokuthathu"). Ake sibheke esinye isibonelo sombuzo wombhalo(). Cabanga ukuthi le yimakhaphu yethu: Ngena ngemvume

Masibhale umbuzo obuyisela inani lesibaluli se- href: document.queryXPaths("//a[text() = 'Ngena Ngemvume']/@href").results.

Lona umbuzo we-XPath kudokhumenti yamanje, njengesibonelo sokugcina, kodwa kulokhu sibuyisela isibaluli se- href sesixhumanisi (isici) esiqukethe umbhalo othi “Ngena Ngemvume”. Okwangempela kubuyisiweumphumela uthi ["/login.html"]. Ukubuka konke Kwemisebenzi ye-XPath Kunenombolo yemisebenzi ye-XPath, futhi cishe awuyazi. Kukhona okuningana, ngicabanga, okufanele ukwazi ngakho, kufaka phakathi okulandelayo:

starts-withUma umbhalo uqala ngesinye isibonelo sombhalo othize, uqala-ngo(@href, 'http:') ubuyisela iqiniso uma isibaluli se- href siqala ngokuthi http:. iquketheUma umbhalo uqukethe esinye isibonelo sombhalo othile, uqukethe(umbhalo(), "Smashing Magazine") ubuyisela iqiniso uma inodi yombhalo iqukethe amagama athi “Smashing Magazine” kuyo noma yikuphi. countIbuyisela isibalo sokuthi zingaki okufanayo embuzweni. Isibonelo, i-count(//*[starts-with(@href, 'http:']) ibuyisela isibalo sokuthi zingaki izixhumanisi endaweni yokuqukethwe ezinezici ezinesibaluli se- href esiqukethe umbhalo oqala ngokuthi http:. I-substringIsebenza njenge-JavaScript substring, ngaphandle kokuthi udlulise uchungechunge njenge-agumenti. Isibonelo, i-substring("umbhalo wami", 2, 4) ibuyisela okuthi "y t". substring-beforeIbuyisela ingxenye yeyunithi yezinhlamvu ngaphambi kwenye iyunithi yezinhlamvu. Isibonelo, ukufaka-ngaphambi("umbhalo wami", " ") kubuyisela "yami". Ngokufanayo, i-substring-before("hi","bye") ibuyisela iyunithi yezinhlamvu engenalutho. substring-afterIbuyisela ingxenye yeyunithi yezinhlamvu ngemva kwenye iyunithi yezinhlamvu. Isibonelo, u-substing-after("umbhalo wami", " ") ubuyisela "umbhalo". Ngokufanayo, i-substring-after("hi","bye") ibuyisela iyunithi yezinhlamvu engenalutho. normalize-spaceIbuyisela iyunithi yezinhlamvu ye-agumenti ngesikhala esimhlophe esijwayelekile ngokuhlubula isikhala esimhlophe esiholayo nesilandelayo bese ifaka esikhundleni sokulandelana kwezinhlamvu zesikhala esimhlophe ngesikhala esisodwa. hhayiIbuyisela iqiniso eliphusile uma impikiswano ingamanga, uma kungenjalo ingamanga. trueReturns boolean true. falseIbuyisela amanga we-boolean. concatInto efanayo ne-JavaScript concat, ngaphandle kokuthi ungayisebenzisi njengendlela ochungechungeni. Kunalokho, ufaka zonke izintambo ofuna ukuzihlanganisa. string-lengthLokhu akufani nobude beyunithi yezinhlamvu ye-JavaScript, kodwa kunalokho kubuyisela ubude beyunithi yezinhlamvu enikezwe yona njengengxabano. translateLokhu kuthatha iyunithi yezinhlamvu bese kushintsha impikiswano yesibili ibe impikiswano yesithathu. Isibonelo, ukuhumusha("abcdef", "abc", "XYZ") okuphumayo XYZdef.

Ngaphandle kwale misebenzi ethile ye-XPath, kunenombolo yeminye imisebenzi esebenza ngokufana nozakwabo be-JavaScript - noma ozakwabo kunoma yiluphi ulimi lokuhlela - okungenzeka futhi ukuthole kuwusizo, njengephansi, uphahla, umjikelezo, isamba, njalonjalo. Idemo elandelayo ibonisa umsebenzi ngamunye wale: Bona imisebenzi yezinombolo ye-Pen XPath [efakwe ngemfoloko] nguBryan Rasmussen. Qaphela ukuthi, njengeningi lemisebenzi yokukhohlisa iyunithi yezinhlamvu, eziningi zezinombolo zithatha okokufaka okukodwa. Lokhu, vele, ngoba kufanele zisetshenziselwe ukubuza, njengakusibonelo sokugcina se-XPath: //li[phansi(umbhalo()) > 250]/@val

Uma uzisebenzisa, njengoba iningi lezibonelo zenza, uzogcina usuyiqhuba endaweni yokuqala ehambisana nendlela. Kukhona neminye imisebenzi yokuguqula uhlobo okufanele uyigweme ngoba i-JavaScript isivele inezinkinga zayo zokuguqula uhlobo. Kodwa kungase kube nezikhathi lapho ufuna ukuguqula iyunithi yezinhlamvu ibe yinombolo ukuze uyihlole ngokumelene nenye inombolo. Imisebenzi esetha uhlobo lwento i-boolean, inombolo, iyunithi yezinhlamvu, ne-node. Lezi yizinhlobo zedatha ezibalulekile ze-XPath. Futhi njengoba ungase ucabange, iningi lale misebenzi ingasetshenziswa kuma-datatypes angewona ama-DOM nodes. Isibonelo, i-substring-after ithatha iyunithi yezinhlamvu njengoba sesivele siyimbozile, kodwa ingaba iyunithi yezinhlamvu evela kusibaluli se- href. Kungase futhi kube iyunithi yezinhlamvu:

const testSubstringAfter = document.queryXPaths("substring-after('hello world',' ')");

Ngokusobala, lesi sibonelo sizosibuyisela ohlwini lwemiphumela njengokuthi ["umhlaba"]. Ukubonisa lokhu kusebenza, ngenze ikhasi ledemo ngisebenzisa imisebenzi ephikisana nezinto ezingewona amanodi e-DOM: Bona umbuzo wePeniXPath [owenziwe ngemfoloko] nguBryan Rasmussen. Kufanele uqaphele isici esimangalisayo somsebenzi wokuhumusha, okungukuthi uma unohlamvu ku-agumenti yesibili (okungukuthi, uhlu lwezinhlamvu ofuna zihunyushwe) futhi lungekho uhlamvu olufanayo ongahumushela kulo, lolo mlingisi uyasuswa kokuphumayo. Ngakho, lokhu:

translate('Sawubona, Igama lami ngingu-Inigo Montoya, wabulala ubaba, lungiselela ukufa','abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ,','*')

…imiphumela kuyunithi yezinhlamvu, okuhlanganisa nezikhala: [" * * ** "]

Lokhu kusho ukuthi uhlamvu “a” luhunyushwa kunkanyezi (*), kodwa zonke ezinye izinhlamvu ezingenakho ukuhumusha ezinikezwe iyunithi yezinhlamvu eziqondiwe zisuswa ngokuphelele. Isikhala esimhlophe sisaselephakathi kwezinhlamvu ezihunyushwe ngokuthi “a”. Bese futhi, lo mbuzo:

translate('Sawubona, Igama lami ngingu-Inigo Montoya, ubulele ubaba, ulungiselele ukufa','abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ,','**********************************************')")

…ayinayo inkinga futhi ikhipha umphumela obukeka kanjena:

"***** **********************************************************"

Kungase kukushaye ukuthi ayikho indlela elula ku-JavaScript yokwenza lokho kanye okwenziwa umsebenzi wokuhumusha we-XPath, nakuba ezimweni eziningi zokusetshenziswa, esikhundleni sakoKonke ngezinkulumo ezivamile ingakwazi ukuyiphatha. Ungasebenzisa indlela efanayo engiyibonisile, kodwa lokho akulungile uma okufunayo nje ukuhumusha iyunithi yezinhlamvu. Idemo elandelayo isonga umsebenzi wokuhumusha we-XPath ukuze unikeze inguqulo ye-JavaScript: Bheka umsebenzi wokuhumusha wePeni [owenziwe ngemfoloko] nguBryan Rasmussen. Ungayisebenzisa kuphi into efana nalena? Cabangela ukubethela kwe-Caesar Cipher nge-offset enezindawo ezintathu (isb., ukubethela okuphezulu kusuka ku-48 B.C.):

translate("UKhesari uhlela ukuwela iRubicon!", "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz", "XYZABCDEFGHIJKLMNOPQRSTUVWxyzabcdefghijklmnopqrstuvw")

Umbhalo ofakiwe othi “UCaesar uhlela ukuwela iRubicon!” imiphumela kokuthi “Zxbpxo fp mixkkfkd ql zolpp qeb Oryfzlk!” Ukuze unikeze esinye isibonelo esisheshayo samathuba ahlukene, ngenze umsebenzi wensimbi othatha okokufaka kwentambo futhi usebenzise umsebenzi wokuhumusha ukuze ubuyisele umbhalo, okufaka phakathi zonke izinhlamvu ezithatha umlauts. Bheka umsebenzi wensimbi yePeni [owenziwe ngemfoloko] nguBryan Rasmussen.

const metal = (str) => { return translate(str, "AOUaou","ÄÖÜäöü"); }

Futhi, uma kunikezwa umbhalo othi “Motley Crue rules, rock on dudes!”, ibuyisela “Mötley Crüe rüles, röck ön düdes!” Ngokusobala, umuntu angase abe nazo zonke izinhlobo zokusebenzisa i-parody yalo msebenzi. Uma kunguwe, le ndatshana ye-TVTropes kufanele ikunikeze ugqozi oluningi. Ukusebenzisa i-CSS Nge-XPath Khumbula isizathu sethu esiyinhloko sokusebenzisa izikhethi ze-CSS kanye ne-XPath: I-CSS iqonda kahle kakhulu ukuthi ikilasi liyini, kanti okungcono kakhulu ongakwenza nge-XPath ukuqhathanisa izintambo zesibaluli sekilasi. Lokho kuzosebenza ezimweni eziningi. Kodwa uma uke wangena esimweni lapho, yithi, othile adale amakilasi aqanjwe ngokuthi .primaryLinks kanye .primaryLinks2 futhi ubusebenzisa i-XPath ukuze uthole ikilasi elithi .primaryLinks, lapho-ke ungase ungene ezinkingeni. Inqobo nje uma kungekho lutho oluwubuwula olunjalo, cishe uzosebenzisa i-XPath. Kodwa kuyadabukisa ukubika ukuthi ngike ngasebenza ezindaweni lapho abantu benza lezo zinhlobo zezinto eziwubuwula. Nansi enye idemo esebenzisa i-CSS ne-XPath ndawonye. Ibonisa okwenzekayo lapho sisebenzisa ikhodi ukuze sisebenzise i-XPath endaweni yokuqukethwe okungeyona indawo yedokhumenti. Bona i-Pen css kanye ne-xpath ndawonye [ifakwe ngemfoloko] nguBryan Rasmussen. Umbuzo we-CSS uthi .ama-athikili ahlobene a, alanda ama-elementi amabili ku-div eyabelwe isigaba sama-athikili ahlobene. Ngemva kwalokho imibuzo emithathu “emibi,” okusho ukuthi, imibuzo engenzi esifuna ikwenze lapho isebenza ngalezi zici njengenodi yomongo. Ngingachaza ukuthi kungani beziphatha ngendlela ehlukile kunaleyo obungayilindela. Imibuzo emithathu emibi ebuzwayo yilena:

//text(): Ibuyisela wonke umbhalo kudokhumenti. //a/text(): Ibuyisela wonke umbhalo ongaphakathi kwezixhumanisi kudokhumenti. ./a/text(): Ayibuyi miphumela.

Isizathu sale miphumela ukuthi ngenkathi umongo wakho kuyizici ezibuyisiwe zisuka embuzweni we-CSS, // kuphambene nedokhumenti yonke. Lawa amandla e-XPath; I-CSS ayikwazi ukusuka ku-node ikhuphuke iye edlozini bese iye kumfowabo walelo dlozi, futhi yehle iye esizukulwaneni saleyo ngane yakini. Kodwa i-XPath ingakwazi. Ngaleso sikhathi, ./ ibuza izingane zenodi yamanje, lapho ichashazi (.) limele indawo yamanje, futhi i-front slash (/) imele ukuya endaweni ethile yengane — noma ngabe isibaluli, isici, noma umbhalo kunqunywa ingxenye elandelayo yendlela. Kodwa ayikho ingane into ekhethwe umbuzo we-CSS, ngaleyo ndlela lowo mbuzo nawo awubuyiseli lutho. Kunemibuzo emithathu emihle kuleyo demo yokugcina:

.//umbhalo(), ./umbhalo(), normalize-space(./text()).

Umbuzo we-normalization-space ubonisa ukusetshenziswa komsebenzi we-XPath, kodwa futhi ulungisa inkinga efakwe kweminye imibuzo. I-HTML yakheke kanje:

Ukuzenzakalela Ukuhlolwa Kwesici Sakho Nge-Selenium WebDriver

Umbuzo ubuyisela okuphakelayo komugqa ekuqaleni nasekupheleni kwenodi yombhalo,futhi i-normalization-space isusa lokhu. Ukusebenzisa noma yimuphi umsebenzi we-XPath obuyisela okuthile okungeyona i-boolean enokufakwayo kwe-XPath kusebenza kweminye imisebenzi. Idemo elandelayo ibonisa inani lezibonelo: Bona izibonelo ze-Pen xpath function [ezifakwe ngemfoloko] nguBryan Rasmussen. Isibonelo sokuqala sibonisa inkinga okufanele uyiqaphele. Ngokukhethekile, ikhodi elandelayo:

document.queryXPaths("substring-after(//a/@href,'https://')");

…ibuyisela iyunithi yezinhlamvu eyodwa:

"www.smashingmagazine.com/2018/04/feature-testing-selenium-webdriver/"

Kunengqondo, akunjalo? Le misebenzi ayibuyiseli amalungu afanayo kodwa iwuchungechunge olulodwa noma izinombolo ezizodwa. Ukwenza umsebenzi noma yikuphi ngemiphumela eminingi kubuyisela kuphela umphumela wokuqala. Umphumela wesibili ubonisa lokho esikufuna ngempela:

document.queryCSSSelectors("a").queryXPaths("substring-after(./@href,'https://')");

Okubuyisela uchungechunge lwezintambo ezimbili:

["www.smashingmagazine.com/2018/04/feature-testing-selenium-webdriver/",www.smashingmagazine.com/2022/11/automated-test-results-improve-accessibility/"]

Imisebenzi ye-XPath ingafakwa njengemisebenzi ku-JavaScript. Ngakho-ke, uma sazi ukwakheka kwe-URL ye-Smashing Magazine, singenza lokhu okulandelayo (kunconyiwe ukusebenzisa izifanekiso zesifanekiso): `humusha( umucu omncane( substring-after(./@href, ‘www.smashingmagazine.com/') ,9), '/','')`

Lokhu kuba nzima kakhulu kangangokuthi kudinga amazwana achazayo ukuthi yenzani: thatha yonke i-URL kusibaluli se- href ngemuva kokuthi www.smashingmagazine.com/, susa izinhlamvu zokuqala eziyisishiyagalolunye, bese uhumusha uhlamvu lwe-slash oluya phambili lube yize ukuze ukhiphe isiphetho esiphambili. Uhlu oluvelayo:

["isici-sokuhlola-selenium-webdriver","okuzenzakalelayo-imiphumela-yokuhlola-ithuthukisa ukufinyeleleka"]

Amacala Wokusebenzisa we-XPath I-XPath ingakhanya ngempela ekuhloleni. Isizathu akunzima ukusibona, njengoba i-XPath ingasetshenziswa ukuthola yonke into ku-DOM, kunoma iyiphi indawo ku-DOM, kuyilapho i-CSS ingakwazi. Awukwazi ukuthembela kumakilasi e-CSS asele angashintshile ezinhlelweni eziningi zokwakha zesimanje, kodwa nge-XPath, siyakwazi ukwenza ukufana okuqinile kokuthi kuyini okuqukethwe kombhalo we-elementi, ngaphandle kokushintsha kwesakhiwo se-DOM. Kube nocwaningo kumasu akuvumela ukuthi wenze izivivinyo ze-XPath eziqinile. Ayikho into embi njengokwenza ukuhlolwa kuphume futhi kuhluleke ngoba nje isikhethi se-CSS asisasebenzi ngoba okuthile kuqanjwe kabusha noma kususiwe. I-XPath nayo inhle kakhulu ekukhishweni kwezindawo eziningi. Kukhona indlela engaphezu kweyodwa yokusebenzisa imibuzo ye-XPath ukufanisa isici. Okufanayo kuyiqiniso nge-CSS. Kodwa imibuzo ye-XPath ingangena ezintweni ngendlela eqondiswe kakhudlwana ekhawulela lokho okubuyiswayo, okukuvumela ukuthi uthole okufanayo okuthile lapho kungase kube khona okufanayo okuningana okungaba khona. Isibonelo, singasebenzisa i-XPath ukuze sibuyisele ingxenye ethile ye-h2 equkethwe ngaphakathi kwe-div elandela ngokushesha i-div yakini, yona equkethe ingxenye yesithombe sengane esinesibaluli sedatha-testID="leader" kuyo:

awusitholi lesi sihloko

Ungasitholi nalesi sihloko

Isihloko sesithombe somholi

Lona umbuzo: document.queryXPaths(` //div[ umfowabo olandelayo::div[1] /img[@data-testID='umholi'] ] /h2/ umbhalo() `);

Ake sifake idemo ukuze sibone ukuthi konke kuhlangana kanjani: Bheka Umbuzo Wepen Complex H2 [owenziwe ngemfoloko] nguBryan Rasmussen. Ngakho, yebo. Ziningi izindlela ezingaba khona eziya kunoma iyiphi into ekuhlolweni kusetshenziswa i-XPath. I-XSLT 1.0 Ukuhoxiswa Ngishilo kusenesikhathi ukuthi ithimba le-Chrome lihlela ukususa ukwesekwa kwe-XSLT 1.0 kusiphequluli. Lokho kubalulekile ngoba i-XSLT 1.0 isebenzisa uhlelo olugxile ku-XML ukuze kuguqulwe idokhumenti, yona ethembele ku-XPath 1.0, okuyikhona okutholakala kuziphequluli eziningi. Uma lokho kwenzeka, sizolahlekelwa ingxenye ebalulekile ye-XPath. Kodwa uma kubhekwa iqiniso lokuthi i-XPath inhle ngempela ekuhloleni ukubhala, ngikuthola kungenakwenzeka ukuthi i-XPath iyonke izonyamalala noma nini maduze. Sekushiwo lokho, ngiqaphele ukuthi abantu baba nentshisekelo esicini lapho sisuswa. Futhi lokho kuyiqiniso uma kwenzeka i-XSLT 1.0 ihoxiswa. Kunengxoxo yonke eyenzekayo ku-Hacker News egcwele izimpikiswano ezimelene nokuhoxiswa. Okuthunyelwe ngokwako kuyisibonelo esihle sokudala uhlaka lokubhuloga nge-XSLT. Wenaungazifundela wena ingxoxo, kodwa ingena ekutheni i-JavaScript ingasetshenziswa kanjani njenge-shim ye-XLST ukuphatha lezo zinhlobo zamacala. Ngiphinde ngibone iziphakamiso zokuthi iziphequluli kufanele zisebenzise i-SaxonJS, eyimbobo ye-JavaScript's Saxon XSLT, XQUERY, kanye nezinjini ze-XPath. Lowo ngumbono othokozisayo, ikakhulukazi njengoba i-Saxon-JS isebenzisa inguqulo yamanje yalokhu kucaciswa, kuyilapho kungekho siphequluli esisebenzisa noma iyiphi inguqulo ye-XPath noma i-XSLT ngale kwe-1.0, futhi ayikho esebenzisa i-XQuery. Ngifinyelele ku-Norm Tovey-Walsh e-Saxonica, inkampani engemuva kwe-SaxonJS nezinye izinguqulo zenjini ye-Saxon. Wathi: “Uma noma yimuphi umthengisi wesiphequluli obenentshisekelo yokuthatha i-SaxonJS njengesiqalo sokuhlanganisa ubuchwepheshe besimanje be-XML esipheqululini, singajabula ukuxoxa ngayo nabo.”—Norm Tovey-Walsh.

Kodwa futhi wanezela: "Ngingamangala kakhulu uma noma ubani ecabanga ukuthi ukuthatha i-SaxonJS ngendlela yayo yamanje futhi ayilahle ekwakhiweni kwesiphequluli kungashintshile kungaba indlela efanelekile. Umthengisi wesiphequluli, ngokwemvelo yokuthi bakha isiphequluli, angasondela ekuhlanganiseni ezingeni elijule kakhulu kunathi 'ngaphandle'.”—Norm Tovey-Walsh.

Kuyaqapheleka ukuthi ukuphawula kukaTovey-Walsh kufike cishe isonto ngaphambi kwesimemezelo sokuhoxiswa kwe-XSLT. Isiphetho Ngingaqhubeka nokuqhubeka. Kepha ngithemba ukuthi lokhu kukhombisile amandla e-XPath futhi kukunikeze izibonelo eziningi ezikhombisa ukuthi ungayisebenzisa kanjani ukufeza izinto ezinhle. Yisibonelo esihle sobuchwepheshe obudala esitakini sesiphequluli esesenezinsiza eziningi namuhla, noma ngabe awukaze wazi ukuthi bukhona noma ungakaze ucabange ukusifinyelela. Ukufunda Okuqhubekayo

"Ukuthuthukisa Ukuqina Kokuhlolwa Kwewebhu Okuzenzakalelayo Ngolimi Lwemvelo" (I-ACM Digital Library) ka-Maroun Ayli, Youssef Bakouny, Nader Jalloul, kanye no-Rima KilanyLe ndatshana inikeza izibonelo eziningi ze-XPath zokubhala izivivinyo eziqinile. I-XPath (MDN)Le indawo enhle kakhulu ongaqala ngayo uma ufuna incazelo yobuchwepheshe enemininingwane yokuthi i-XPath isebenza kanjani. I-XPath Tutorial (ZVON)Ngithole lesi sifundo siwusizo kakhulu ekufundeni kwami, ngenxa yezibonelo eziningi nezincazelo ezicacile. I-XPatherLeli thuluzi elisebenzayo likuvumela ukuthi usebenze ngokuqondile nekhodi.

You May Also Like

Enjoyed This Article?

Get weekly tips on growing your audience and monetizing your content — straight to your inbox.

No spam. Join 138,000+ creators. Unsubscribe anytime.

Create Your Free Bio Page

Join 138,000+ creators on Seemless.

Get Started Free