Waxaan ku jiray horumarka-dhamaadka hore muddo dheer oo ku filan si aan u arko isbeddel sannadihii la soo dhaafay: horumarinta da'da yar oo la shaqeynaya qaab cusub oo barnaamij ah iyaga oo aan fahmin macnaha taariikheed ee ku jira. Waa, dabcan, si fiican loo fahmi karo in aan wax la garanayn. Shabakaddu waa meel aad u weyn oo leh xirfado iyo takhasusyo kala duwan, mar walbana ma naqaanno waxa aynaan garanayn. Barashada goobtan waa safar socda halkii ay ka ahaan lahayd wax mar dhaca oo dhammaanaya. Arrin ku saabsan: Qof ka mid ah kooxdayda ayaa waydiiyay haddii ay suurtagal tahay in la sheego haddii isticmaalayaashu ay ka guurayaan tabo gaar ah oo ku yaal UI. Waxaan tilmaamay dhacdadii soo dejinta ka hor JavaScript. Laakiin kuwa tan wax ka qabtay ka hor waxay ogyihiin in tani ay suurtogal tahay sababtoo ah waxaa lagu dhuftay digniino ku saabsan xogta aan la keydin ee goobaha kale, kuwaas oo ka hor inta aan la dejin waa kiis isticmaalka caadiga ah. Waxa kale oo aan tilmaamay bogga Qari oo muuqa wax ka beddel dhacdooyinka saaxiibkay si loo qiyaaso. Sideen ku ogaaday taas? Sababtoo ah waxay ku timid mashruuc kale, maaha sababtoo ah waxaan ku bartay markii ugu horeysay ee aan baranayey JavaScript. Xaqiiqdu waxay tahay in qaababka casriga ah ee casriga ah ee casriga ah ay ku taagan yihiin garbaha tiknoolajiyada tiknoolajiyada ee iyaga ka horreeyay. Waxay ku dhaqmaan dhaqamada horumarinta, inta badan waayo-aragnimo horumariye ka wanaagsan oo yaraysa, ama xitaa meesha ka saaraysa, baahida loo qabo in la ogaado ama la taabto waxa dhaqan ahaan ahaa fikradaha dhamaadka-horreedka lagama maarmaanka u ah qof kastaa laga yaabaa inuu ogaado. Tixgeli Qaabka Shayga CSS (CSSOM). Waxaa laga yaabaa inaad filayso in qof kasta oo ka shaqeeya CSS iyo JavaScript uu leeyahay khibrad gacan-ku-ool ah oo CSSOM ah, laakiin taasi had iyo jeer maahan kiiska. Waxaa jiray mashruuc falcelin ah oo loogu talagalay goobta ganacsiga e-commerce ee aan ka shaqeeyay halka aan ugu baahanahay inaan ku shubno xaashida qaab bixiyaha lacag bixinta hadda la doortay. Dhibaatadu waxay ahayd in xaashida qaabka uu ku dul shubanayay bog kasta markii runtii loogu baahnaa bog gaar ah. Horumariyaha loo xilsaaray inuu tan sameeyo waligeed si firfircoon uma uu shubin xaashida qaabka. Mar labaad, tani gabi ahaanba waa la fahmi karaa marka React ay meesha ka saarto habkii dhaqanka ahaa ee aad gaadhay. CSSOM waxay u badan tahay inaysan ahayn wax aad uga baahan tahay shaqadaada maalinlaha ah. Laakiin waxay u badan tahay inaad u baahan doonto inaad la falgasho mar uun, xataa hal mar. Waayo-aragnimadaasi waxay igu dhiirigelisay inaan maqaalkan qoro. Waxaa jira waxyaabo badan oo shabakadaha iyo tignoolajiyada jira ee duurjoogta ah oo aanad waligaa si toos ah u taaban shaqadaada maalinlaha ah. Waxaa laga yaabaa inaad si cadaalad ah ugu cusub tahay horumarinta shabakada oo aadan ka warqabin iyaga sababtoo ah waxaad ku dhex jirtaa qaab-dhismeedka gaarka ah ee aan u baahnayn inaad si qoto dheer u ogaato, ama xitaa dhammaan. Waxaan si gaar ah uga hadlayaa XML, oo ​​in badan oo naga mid ah aan ognahay inay tahay luqad qadiimi ah oo aan gebi ahaanba ka duwanayn HTML. Waxaan tan u keenaya sababtoo ah wadahadaladii WHATWG ee dhowaan soo jeedinaya in qayb muhiim ah oo ka mid ah xirmooyinka XML ee loo yaqaan barnaamijka XSLT laga saaro daalacashada. Tani waa dhab ahaan nooca da'da, tignoolajiyada jirta ee aan haysanay sanado taas oo loo isticmaali karo wax la taaban karo sida xaalada CSSOM kooxdaydu ku jirtay. Horay ma ula shaqeysay XSLT? Aan aragno haddii aan si weyn ugu tiirsanno tignoolajiyadan da'da weyn oo aan ka faa'iidaysano sifooyinkeeda ka baxsan macnaha XML si aan wax uga qabanno dhibaatooyinka adduunka dhabta ah maanta. XPath: API Central Farsamaynta XML ee ugu muhiimsan ee laga yaabo inay tahay tan ugu faa'iido badan ee ka baxsan aragtida tooska ah ee XML waa XPath, luqadda weydiinta oo kuu ogolaanaysa inaad hesho node kasta ama sifo geedka calaamadaynta leh hal element. Waxaan jacayl shakhsi ah u qabaa XSLT, laakiin taasi waxay sidoo kale ku tiirsan tahay XPath, jacaylka shakhsi ahaaneedna waa in meel la iska dhigaa muhiimadda darajada. Doodda ka saarista XSLT ma sheegin wax ku saabsan XPath, markaa waxaan u maleynayaa in weli la oggol yahay. Taasi way fiicantahay sababtoo ah XPath waa API-ga dhexe iyo kan ugu muhiimsan qaybtan tignoolajiyada, gaar ahaan marka la isku dayayo in la helo wax loo isticmaalo si ka baxsan isticmaalka XML caadiga ah. Waa muhiim sababtoo ah, halka xulashada CSS loo isticmaali karo in lagu helo inta badan walxaha boggaaga, ma heli karaan dhamaantood. Intaa waxaa dheer, xulashada CSS looma isticmaali karo in lagu helo shay ku salaysan booska ay hadda ku leedahay DOM. XPath wuu awoodaa. Hadda, qaar idinka mid ah oo tan akhriya ayaa laga yaabaa inay garanayaan XPath, qaarna ma ogaan karaan. XPath waa aag qurux badan oo tignoolajiyada ah, runtiina ma bari karo dhammaan aasaaska oo sidoo kale ku tusi karo waxyaabo qabow oo lagu sameeyo hal maqaal oo sidan oo kale ah. Runtii waxaan isku dayay inaan qoro maqaalkaas, laakiin celceliska daabacaadda Majaladda Smashing ma dhaafto 5,000 oo erey. Horeba waan ka badnaa2,000 oo kelmadood halka kala badh kaliya loo marayo aasaaska. Marka, waxaan bilaabayaa inaan ku sameeyo waxyaabo qabow XPath waxaanan ku siin doonaa qaar ka mid ah xiriiriyeyaasha aad u isticmaali karto aasaaska haddii aad u aragto walxahan mid xiiso leh. Isku darka XPath & CSS XPath waxa ay samayn kartaa waxyaabo badan oo aanay dooran CSS-du marka ay waydiinayaan curiyayaasha. Laakin xulayaasha CSS waxay sidoo kale samayn karaan dhowr waxyaalood oo XPath aysan awoodin, kuwaas oo ah, canaasirta weydiinta magaca fasalka.

CSS XPath .Classkayga /*[waxaa ku jira (@class, "myClass")]

Tusaalahan, CSS waxay waydiinaysaa canaasiirta uu ku jiro magaca fasalka .myClass. Dhanka kale, tusaalaha XPath wuxuu waydiinayaa canaasiir ka kooban fasal sifo leh xarigga "myClass". Si kale haddii loo dhigo, waxay doorataa curiyeyaasha leh myClass sifo kasta, oo ay ku jiraan canaasirta leh magaca fasalka .myClass - iyo sidoo kale curiyeyaasha "MyClass" ee xargaha, sida .myClass2. XPath way ka ballaadhan tahay macnahaas. Markaa, maya. Ma soo jeedinayo in aan iska tuurno CSS oo aan bilowno xulashada dhammaan walxaha iyada oo loo marayo XPath. Taasi maaha ujeedku. Xaqiiqdu waxay tahay in XPath uu samayn karo waxyaabo aysan CSS awoodin oo weli noqon kara mid aad waxtar u leh, inkasta oo ay tahay tignoolajiyada da'da ah ee ku jira kaydka browserka oo laga yaabo inaysan u muuqan wax muuqda marka hore. Aynu wada isticmaalno labada teknoolajiyada ma aha oo kaliya sababtoo ah waan awoodnaa, laakiin sababtoo ah waxaan ku baran doonaa wax ku saabsan XPath habka, samaynta qalab kale oo ku jira xirmadaada - mid aadan ogeyn inuu halkaas joogay! Dhibaatadu waxay tahay in dokumentiga JavaScript.qiimaynta habka iyo hababka kala duwan ee xulashada weydiinta ee aan u isticmaalno CSS APIs ee JavaScript ay iswaafaqayaan. Waxaan sameeyay API weydiimo la jaan qaadaya si aan u bilowno, in kasta oo la qirayo, anigu fikir badan kama gelin tan iyo markii ay ka tagtay waxa aan halkan ku samaynayno. Waa kuwan tusaale shaqo oo fudud oo fudud oo ah dhisaha weydiinta dib loo isticmaali karo: Eeg qalinka queryXPath [forked] ee Bryan Rasmussen. Waxaan ku daray laba hab oo ku saabsan shayga dukumeentiga: queryCSSSelectors (taas oo asal ahaan querySelectorAll) iyo queryXPaths. Labadanba waxay soo celiyaan shay Natiijooyinka weydiinta:

{ weydiinType: noodhadhka | xadhig | lambarka | boolean, Natiijooyinka: wax kasta[] // html canaasirta, xml walxaha, xargaha, tirooyinka, booleans, su'aalCSSSelectors: ( weydiin: xarig, wax ka beddel: boolean) => Natiijooyinka weydiimaha, queryXpaths: ( weydiin: xarig, wax ka beddel: boolean) => weydii natiijooyinka }

WeydiintaCSSSelectors iyo queryXpaths waxay maamulaan su'aalaha aad siiso iyaga oo kor u qaadaya walxaha ku jira shaxda natiijooyinka, ilaa inta ay natiijadu ka kooban tahay noodhka nooca, dabcan. Haddii kale, waxay soo celin doontaa natiijada weydiinta oo wadata hannaan madhan iyo nooc nood ah. Haddii hantida wax-ka-beddelka loo dejiyo run, hawluhu waxay beddeli doonaan Natiijooyinka weydiintooda. Xaaladna ma aha in tan loo isticmaalo deegaan wax soo saar. Waxaan sidan u samaynayaa si aan u muujiyo saamaynta kala duwan ee isticmaalka labada API-ga weydiinta wadajirka ah. Tusaalaha Weydiimaha Waxaan rabaa in aan tuso dhawr tusaale oo su'aalo ah oo kala duwan oo XPath ah kuwaas oo muujinaya qaar ka mid ah waxyaabaha xoogga leh ee ay samayn karaan iyo sida loogu isticmaali karo meelo kale oo habab kale ah. Tusaalaha koowaad waa //li/text(). Tani waxay waydiinaysaa dhammaan curiyayaasha waxayna soo celinaysaa noodhadhkooda qoraalka. Haddaba, haddii aan weydiin lahayn HTML-ka soo socda:

  • hal
  • laba
  • saddex

…tani waa waxa la soo celiyay:

{"queryType":"xpathEvaluate","natiijooyinka":["hal","laba","saddex"],"resultType":"string"}

Si kale haddii loo dhigo, waxaynu helnaa sidaan soo socota: ["hal","laba","saddex"]. Caadiyan, waxa aad waydiin kartaa in li element si ay taas u helaan, u rogo natiijada su'aashaas array, khariidad habka, oo soo celi noodhka qoraalka shay kasta. Laakiin taas waxaan ku samayn karnaa si kooban XPath: document.queryXPaths("//li/text()").natiijooyinka.

U fiirso in habka loo helo node qoraalku uu yahay in la isticmaalo qoraal(), kaas oo u eg saxeex shaqo -waana waa. Waxay soo celisaa noodhka qoraalka curiye. Tusaalahayaga, waxa ku jira calaamadaynta saddex curiye, oo mid walba ka kooban yahay qoraal ("hal", "laba", iyo "saddex"). Aan eegno hal tusaale oo kale oo qoraal ah () weydiin. Ka soo qaad in tani ay tahay calaamadeena: Soo gal

Aynu qorno waydiin soo celisa qiimaha sifada href: document.queryXPaths("//a[text() = 'Sign in']/@href").natiijooyinka.

Tani waa su'aal XPath ah oo ku saabsan dukumeentiga hadda jira, si la mid ah tusaalihii u dambeeyay, laakiin markan waxaan soo celinaynaa sifada href ee isku xirka (qayb) ka kooban qoraalka "Sign In". Dhab ahaantii soo laabtaynatiijadu waa ["/login.html"]. Dulmarka Hawlaha XPath Waxaa jira tiro shaqo oo XPath ah, waxaana laga yaabaa inaadan aqoon iyaga. Waxaa jira dhowr, waxaan filayaa,, kuwaas oo mudan in wax laga ogaado, oo ay ku jiraan kuwan soo socda:

wuxuu ku bilaabmaa- Haddii qoraalku ku bilowdo tusaale gaar ah oo qoraal ah, wuxuu ku bilaabmaa (@href, 'http:') run buu ku noqdaa haddii sifada href ay ka bilowdo http:. Haddii qoraalku ka kooban yahay tusaale gaar ah oo qoraal ah, ka kooban yahay (qoraal(), "Jaraa'idka Jarida") run soo noqda haddii noodhka qoraalku ka kooban yahay ereyada "Joornaalka Jabinta" meel kasta. tirinta ayaa soo celisa tirinta inta kulan ee su'aasha ah. Tusaale ahaan, tirinta (//*[bilawga-with(@href, 'http:']) waxay soo celisaa tirinta inta isku xidh ee noodhka macnaha guud ay leeyihiin xubno leh sifo href oo ka kooban qoraalka ka bilaabmaya http:. Substring wuxuu u shaqeeyaa sida JavaScript substring, marka laga reebo inaad u gudubto xadhigga dood ahaan. Tusaale ahaan, xaraf-hoosaad (" my text", 2, 4) waxay soo celisaa "y t". Xarig-hoosaad-kahor soo celisa qaybta xadhigga ka hor xadhig kale. Tusaale ahaan, hoos-u-dhigid ka hor (" qoraalkayga", "") wuxuu soo celiyaa "my". Sidoo kale, xadhig-hoosaadka ka hor ("hi","bye") wuxuu soo celiyaa xadhig madhan. Xadhig-hoosaad-ka-dib-soo-celinta qaybta xadhigga ka dib xadhig kale. Tusaale ahaan, hoos-u-dhigid-ka-dib (" qoraalkayga", "") wuxuu soo celiyaa "qoraalka". Sidoo kale, xadhig-hoosaad ("hi","bye") wuxuu soo celiyaa xadhig madhan. normalize-space Waxay soo celisaa xadhigga dooda oo leh meel cad oo caadiyan iyada oo ka xayuubisay hogaaminta iyo daba-galka booska cad oo bedelaya taxanaha jilayaasha meel cad meel keliya. ma soo celiyo boolean run ah haddi dooda ay been tahay, hadii kale been run waxay soo noqotaa boolean run. been soo celisa boolean been ah. concatWaxa la mid ah sida JavaScript concat, marka laga reebo inaadan u maamulin sida habka on xadhig ah. Bedelkeeda, waxaad gelisaa dhammaan xargaha aad rabto inaad isku xirto. string-lengthTani la mid maaha xadhig-dhererka JavaScript, laakiin waxay soo celisaa dhererka xadhigga waxa loo bixiyaa dood ahaan. Tani waxay qaadanaysaa xadhig oo waxay u beddeshaa doodda labaad doodda saddexaad. Tusaale ahaan, turjumi ("abcdef", "abc", "XYZ") waxay soo saartaa XYZdef.

Marka laga reebo shaqooyinkan gaarka ah ee XPath, waxaa jira tiro hawlo kale ah oo u shaqeeya si la mid ah kuwa dhiggooda ah ee JavaScript - ama dhigooda asal ahaan luuqad kasta oo barnaamij ah - oo aad u badan tahay inaad sidoo kale faa'iido u leedahay, sida dabaqa, saqafka, wareega, wadarta, iyo wixii la mid ah. Muujinta soo socota ayaa muujinaysa mid kasta oo ka mid ah hawlahan: Fiiri Pen XPath nambarada hawlaha [fargeega] ee Bryan Rasmussen. Ogsoonow, sida inta badan shaqooyinka wax-is-daba-marinta xadhigga, qaar badan oo ka mid ah kuwa tirooyinku waxay qaataan hal-gelin. Tani waa, dabcan, sababtoo ah waxay u malaynayaan in loo isticmaalo weydiinta, sida tusaalaha XPath ee u dambeeyay: //li[dabaq (qoraal ())> 250]/@val

Haddii aad isticmaasho, sida tusaalayaasha intooda badani sameeyaan, waxaad ku dhamaan doontaa inaad ku socodsiiso marinka koowaad ee u dhigma waddada. Waxa kale oo jira qaar ka mid ah hawlaha beddelka nooc ka mid ah oo ay tahay inaad iska ilaaliso sababtoo ah JavaScript mar horeba waxay leedahay dhibaatooyin beddelaad oo u gaar ah. Laakiin waxaa jiri kara waqtiyo aad rabto in aad u beddesho xadhig nambar si aad uga hubiso in uu ka soo horjeedo tiro kale. Hawlaha dejiya nooca shay waa boolean, lambar, xadhig, iyo noode. Kuwani waa xogta muhiimka ah ee XPath. Oo sida aad qiyaasi karto, badi hawlahan waxaa loo isticmaali karaa noocyada xogta ee aan ahayn DOM nodes. Tusaale ahaan, xadhig-hoosaadku wuxuu qaataa xadhig sidii aan horeba u daboolnay, laakiin waxay noqon kartaa xadhig ka yimid sifada href. Waxa kale oo ay noqon kartaa oo kaliya xadhig:

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

Sida iska cad, tusaalahan waxa uu dib inoogu soo celin doonaa sida ["adduunyo"] natiijadii. Si tan loo muujiyo ficil ahaan, waxaan sameeyay bogga demo anigoo isticmaalaya hawlo ka dhan ah waxyaalaha aan ahayn DOM nodes: Eeg qalinka queryXPath [forked] ee Bryan Rasmussen. Waa in aad u fiirsato dhinaca la yaabka leh ee shaqada turjumaada, taas oo ah in haddii aad leedahay jile doodda labaad (ie, liiska jilayaasha aad rabto in la turjumo) oo aanay jirin jile u dhigma oo loo turjumo, in jilaagaasi laga saarayo wax soo saarka. Haddaba, tani:

turjumi

Natiijooyinka xadhigga, oo ay ku jiraan meelaha bannaan: ["***"]

Tani waxay ka dhigan tahay in xarafka "a" loo tarjumay calaamad (*), laakiin qof kasta oo kale oo aan lahayn tarjumaad marka la eego xarafka bartilmaameedka ayaa gebi ahaanba meesha laga saaray. Meesha cad waa innaga oo dhaninta u dhaxaysa jilayaasha "a" ee la turjumay. Mar labaad, weydiintan:

turjumi ('Hallo, Magacaygu waa Inigo Montoya, waxaad dishay aabahay, isu diyaari inaad dhimato','abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ,','******************************************))

…ma laha dhibka oo soo saara natiija u eg sidan:

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

Waxaa laga yaabaa inay ku dhufato in aysan jirin hab sahlan oo JavaScript ah oo lagu sameeyo sida saxda ah ee shaqada tarjumaadda XPath ay qabato, in kasta oo xaalado badan oo la isticmaalo, ku beddel dhammaan tibaaxaha caadiga ah. Waxaad isticmaali kartaa isla qaabkii aan soo bandhigay, laakiin taasi waa mid aad u wanaagsan haddii waxa kaliya ee aad rabto ay tahay inaad turjunto xargaha. Muujinta soo socota waxay duubtaa shaqada tarjumaada ee XPath si ay u bixiso nooca JavaScript: Eeg shaqada tarjumaada qalinka [forked] ee Bryan Rasmussen. Halkeed ka isticmaali kartaa wax sidan oo kale ah? Tixgeli sirta Caesar Cipher oo leh saddex-meelood oo ka-goyn ah (tusaale ahaan, sirta khadka-sare ee laga soo bilaabo 48 BC):

Turjumi("Kaysar waxa uu qorsheynayaa in uu ka gudbo Rubicon!", "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz", "XYZABCDEFGHIJKLMNOPQRSTUVWxyzabcdefghijklmnopqrstuvw")

Qoraalka gelinta "Kaysar waxa uu qorsheynayaa in uu ka gudbo Rubicon!" Natiijooyinka "Zxbpxo fp mixkkfkd ql zolp qeb Oryfzlk!" Si aan u bixiyo tusaale kale oo degdeg ah oo suurtagal ah oo kala duwan, waxaan sameeyay hawl bir ah oo qaadata gelinta xargaha oo adeegsada shaqo tarjumaad si aan u soo celiyo qoraalka, oo ay ku jiraan dhammaan jilayaasha qaata umlauts. Eeg shaqada birta qalinka [forked] ee Bryan Rasmussen.

Birta birta ah = (str) => { soo celi turjumaan (str, "AOUaou", "ÄÖÜäöü"); }

Iyo, haddii la siiyo qoraalka "Motley Crue rules, rock on dudes!", soo celisa "Mötley Crüe rüles, röck ön düdes!" Sida cad, mid ayaa laga yaabaa inuu haysto dhammaan noocyada isticmaalka parody ee shaqadan. Haddii taasi adiga tahay, markaa maqaalkan TVTropes waa inuu ku siiyaa dhiirigelin badan. Isticmaalka CSS oo leh XPath Xusuusnow sababta ugu weyn ee aan u isticmaalno xulashada CSS iyo XPath: CSS aad ayuu u fahmayaa waxa fasalku yahay, halka sida ugu fiican ee aad ku samayn karto XPath ay tahay isbarbardhigga sifada fasalka. Taasi waxay shaqayn doontaa inta badan kiisaska. Laakin haddii aad waligaa la kulanto xaalad, dheh, qof abuuray xiisado lagu magacaabo .primaryLinks iyo .primaryLinks2 oo aad isticmaalaysay XPath si aad u hesho fasalka .primaryLinks, markaas waxaad u badan tahay inaad la kulanto dhibaatooyin. Ilaa iyo inta aysan jirin wax nacas ah oo la mid ah, waxaad u badan tahay inaad isticmaasho XPath. Laakiin waan ka xumahay in aan sheego in aan ka soo shaqeeyay meelo ay dadku ku sameeyaan waxyaalahaas nacasnimada ah. Waa kan demo kale oo la isticmaalayo CSS iyo XPath wadar ahaan. Waxay tusinaysaa waxa dhacaya markaan u isticmaalno koodka si aan ugu socodsiino XPath node-ka macnaha guud ee aan ahayn noodhka dukumeentiga. Si wada jir ah u arag qalinka css iyo xpath [forked] by Bryan Rasmussen. Weydiinta CSS waa .relatedarticles a, kaas oo soo saara labada walxood ee ku jira div loo qoondeeyay fasalka .xiriirka. Intaa ka dib waxaa jira saddex su'aalood oo "xun", taas oo ah in la yiraahdo, weydiimaha aan samaynin waxa aan rabno in ay sameeyaan marka ay la socdaan walxahan sida macnaha guud. Waan sharixi karaa sababta ay u dhaqmayaan si ka duwan sidaad filayso. Saddexda su'aalood ee xunxun ee su'aashu waxay tahay:

//text(): Wuxuu soo celiyaa dhammaan qoraalka dukumeentiga. //a/text(): Wuxuu soo celiyaa dhammaan qoraalka gudaha xiriirinta dukumeentiga. ./a/text(): Wax natiijo ah soo celin maayo.

Sababta natiijooyinkan ayaa ah in iyadoo macnaha guud uu yahay xubno laga soo celiyay weydiinta CSS, // ka soo horjeeda dukumeentiga oo dhan. Tani waa xoogga XPath; CSS kama bixi karto meel hoose ilaa awoowe ka dibna u gudbi karo walaalka awoowgaas, oo hoos uguma socon karo farcankii walaalkaas. Laakiin XPath wuu awoodaa. Dhanka kale, ./ waxay waydiinaysaa carruurta qanjidhada hadda jirta, halkaasoo dhibicda (.) ay u taagan tahay noodhka hadda, iyo jeexjeexa hore (/) waxay u taagan tahay u gudubka qanjirada carruurta - haddii ay tahay sifo, curiye, ama qoraal waxaa go'aaminaya qaybta xigta ee waddada. Laakin ma jiro ilmo shay ay dooratay waydiinta CSS, markaa su'aashu waxay sidoo kale soo celinaysaa waxba. Waxaa jira saddex su'aalood oo wanaagsan demo-dambe:

.//qoraal(), ./qoraal(), caadi ka dhig-space(./text()).

Weydiinta meel-caadiyeedku waxay muujinaysaa isticmaalka shaqada XPath, laakiin sidoo kale waxay hagaajisaa dhibaatada ku jirta weydiimaha kale. HTML-ku wuxuu u qaabaysan yahay sidan:

Ku Automating Tijaabada Muuqaalkaaga Selenium WebDriver

Weydiinta waxay soo celisaa quudinta laynka bilawga iyo dhammaadka noodhka qoraalka,oo caadi ka dhig-meel bannaan ayaa tan ka saara. Isticmaalka shaqo kasta oo XPath ah oo soo celisa shay aan ahayn boolean oo leh galinta XPath waxay khusaysaa hawlo kale. Muujinta soo socota waxay muujineysaa dhowr tusaale: Eeg tusaalooyinka hawlaha Pen xpath [forked] ee Bryan Rasmussen. Tusaalaha ugu horreeya wuxuu muujinayaa dhibaato ay tahay inaad ka taxadarto. Gaar ahaan, koodka soo socda:

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

… soo celiyaa hal xadhig:

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

Waxay macno samaynaysaa, sax? Hawlahani sooma celiyaan taxanayaal balse waxay soo celiyaan xardhgo keliya ama tirooyin keli ah. Ku socodsiinta shaqada meel kasta oo leh natiijooyin badan kaliya waxay soo celisaa natiijada ugu horreysa. Natiijada labaad waxay muujinaysaa waxa aan dhab ahaantii doonayno:

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

Kaas oo soo celinaya dhowr xarig oo kala duwan:

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

Hawlaha XPath waxaa loo dhejin karaa sida shaqooyinka JavaScript. Marka, haddii aan ognahay qaab dhismeedka URL-ka Joornaalka, waxaan samayn karnaa kuwan soo socda (adiga oo isticmaalaya qaab qoraal ah ayaa lagu talinayaa): 'tarjum substring ( substring-ka dib (./@href, 'www.smashingmagazine.com/') ,9), '/','')'

Tani waxay noqonaysaa mid aad u adag ilaa xadka ay u baahan tahay faallooyin qeexaya waxa ay qabato: ka soo qaado dhammaan URL-yada sifada href ka dib www.smashingmagazine.com/, ka saar sagaalka xaraf ee ugu horreeya, ka dibna u turjun jilitaanka hore (/) si aan waxba ahayn si aad uga takhalusto jeexjeexyada hore ee soo socda. Qaabka soo baxay:

["feature-tijaabinta-selenium-webdriver", "natiijooyinka-tijaabada-automated-natiijooyinka-horumar-helitaanka"]

Kiisaska Isticmaalka XPath oo badan XPath runtii waxay ku iftiimin kartaa tijaabada. Sababta maaha mid adag in la arko, maadaama XPath loo isticmaali karo in lagu helo shay kasta oo DOM ah, meel kasta oo DOM ah, halka CSS aanu awoodin. Kuma xisaabtami kartid fasallada CSS ee ku sii jira nidaamyo dhisme oo casri ah oo badan, laakiin XPath, waxaan awoodnaa inaan samayno tabarro aad u adag sida waxa qoraalka curiye yahay, iyada oo aan loo eegin isbeddelka qaabdhismeedka DOM. Waxaa jiray cilmi baaris ku saabsan farsamooyinka kuu ogolaanaya inaad sameyso imtixaanada XPath ee adkeysi leh. Ma jiro wax ka xun in imtixaanadu ay soo baxaan oo ay guuldaraystaan ​​sababtoo ah xulashada CSS hadda ma shaqeynayo sababtoo ah wax ayaa la beddelay ama laga saaray. XPath sidoo kale runtii aad ayey ugu fiican tahay soo saarista goobeeye badan. Waxaa jira wax ka badan hal dariiqo oo loo isticmaalo weydiimaha XPath si loo waafajiyo shay. Si la mid ah waa run CSS. Laakin su'aalaha XPath waxay wax u gelin karaan si ka sii bartilmaameedsan oo xaddidaya waxa soo laabanaya, taasoo kuu oggolaanaysa inaad hesho ciyaar gaar ah oo laga yaabo inay jiraan dhowr kulan oo suurtagal ah. Tusaale ahaan, waxaan u isticmaali karnaa XPath si aan u soo celino shey gaar ah oo h2 ah oo ku jira gudaha div kaas oo isla markiiba raacaya div walaal kaas oo, ka dibna, ka kooban sawirka ilmaha oo leh xog-testID="hogaamiyaha" sifo

ha helin cinwaankan

Sidoo kale ha helin ciwaankan

Madaxa sawirka hogaamiyaha

Tani waa weydiinta: document.queryXPaths(` //div[ soo socda-walaal:: div[1] /img[@data-testID='hogaamiye'] ] /h2/ qoraal () `);

Aan hoos u dhigno demo si aan u aragno sida taasi dhammaan isugu yimaadaan: Eeg Qalinka Complex H2 Weydiinta [forked] ee Bryan Rasmussen. Markaa, haa. Waxaa jira wadooyin badan oo suurtagal ah oo loo maro shay kasta oo ku jira tijaabada iyadoo la adeegsanayo XPath. XSLT 1.0 Hoos u dhaca Waxaan horay u sheegay in kooxda Chrome ay qorsheyneyso inay ka saarto taageerada XSLT 1.0 browserka. Taasi waa muhiim sababtoo ah XSLT 1.0 waxay isticmaashaa barnaamijka XML diiradda saaraya beddelka dukumeentiga taas oo, iyaduna, ku tiirsan XPath 1.0, taas oo ah waxa laga helo daalacashada badankood. Marka taasi dhacdo, waxaan lumin doonaa qayb muhiim ah oo XPath ah. Laakiin marka la eego xaqiiqda ah in XPath ay runtii aad ugu fiican tahay imtixaannada qorista, waxaan u arkaa inaysan suurtogal ahayn in XPath guud ahaan ay meesha ka baxdo mar dhow. Taasi waxay tidhi, waxaan ogaaday in dadku xiiseeyaan sifada marka la qaado. Taasina xaqiiqdii waa run kiiska XSLT 1.0 oo la joojiyay. Waxa jira dood dhan oo ka dhacaysa Hacker News oo ay ka buuxaan doodo ka dhan ah hoos u dhaca. Boostada lafteedu waa tusaale weyn oo abuuraya qaab-dhismeedka blogging ee XSLT. AdigaAdiga ayaa u akhriyi kara dooda, laakiin waxa ay galaysaa sida JavaScript loogu isticmaali karo XLST si uu u maareeyo kiisaska noocaas ah. Waxaan sidoo kale arkay talooyinka ah in daalacayaashu ay isticmaalaan SaxonJS, taas oo ah deked u socota JavaScript's Saxon XSLT, XQUERY, iyo matoorada XPath. Taasi waa fikrad xiiso leh, gaar ahaan sida Saxon-JS ay fuliso nooca hadda ee qeexitaannadan, halka aysan jirin wax browser ah oo hirgeliya nooc kasta oo XPath ama XSLT ah oo ka baxsan 1.0, oo aan midna fulin XQuery. Waxaan gaaray Norm Tovey-Walsh ee Saxonica, shirkadda ka dambeysa SaxonJS iyo noocyada kale ee matoorka Saxon. Wuxuu yidhi: "Haddii iibiyaha browser-ka uu xiisaynayo inuu u qaato SaxonJS barta bilawga ah ee lagu darayo tignoolajiyada casriga ah ee XML browserka, aad ayaan ugu faraxsanahay inaan kala hadalno iyaga." Norm Tovey-Walsh

Laakiin sidoo kale ku daray: "Aad ayaan ula yaabi lahaa haddii qof uu u maleynayo in qaadashada SaxonJS ee qaabka ay hadda tahay oo ay ku riddo dhismaha browserka oo aan isbeddelin waxay noqon doontaa habka ugu habboon. Iibiyaha browserka, dabeecadda xaqiiqda ah in ay dhisaan browserka, waxay u wajahi kartaa isdhexgalka heer aad u qoto dheer oo aan ka 'baxsan karno dibadda'." Norm Tovey-Walsh

Waxaa xusid mudan in faallooyinka Tovey-Walsh ay yimaadeen toddobaad ka hor ku dhawaaqista joojinta XSLT. Gabagabo Waan sii wadi kari lahaa. Laakiin waxaan rajeynayaa in tani ay muujisay awoodda XPath oo ay ku siiso tusaalooyin badan oo muujinaya sida loogu isticmaalo gaaritaanka waxyaabo waaweyn. Waa tusaale ugu fiican ee tignoolajiyada da'da ah ee ku jira kaydka browserka oo weli leh faa'iidooyin badan maanta, xitaa haddii aadan waligaa ogeyn inay jirto ama weligaa kama fikirin inaad gaarto. Akhris Dheeraad ah

"Kobcinta adkeysiga Imtixaanada Shabakadda Automated ee Luuqada Dabiiciga ah" (ACM Digital Library) ee Maroun Ayli, Youssef Bakouny, Nader Jalloul, iyo Rima Kilany Maqaalkani wuxuu bixiyaa tusaalooyin badan oo XPath ah oo loogu talagalay qorista imtixaanada adkeysiga. XPath (MDN)Tani waa meel aad u fiican oo laga bilaabo haddii aad rabto sharraxaad farsamo oo faahfaahsan sida XPath u shaqeyso. Tababarka XPath (ZVON) Waxaan u arkay in casharkan uu yahay kan ugu waxtarka badan waxbarashadeyda, iyadoo ay ugu wacan tahay tusaalooyin badan iyo sharraxaad cad. XPatherQalabkan is-dhexgalka ayaa kuu ogolaanaya inaad si toos ah ula shaqeyso koodka.

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