Ман муддати тӯлонӣ дар рушди пешрафта будам, то тамоюлро дар тӯли солҳо бубинам: таҳиягарони ҷавон бидуни фаҳмидани контексти таърихии он бо парадигмаи нави барномасозӣ кор мекунанд. Надонистани чизе, албатта, комилан фаҳмо аст. Веб як макони хеле калон бо маҷмӯи малакаҳо ва ихтисосҳои гуногун аст ва мо на ҳамеша он чизеро, ки намедонем, медонем. Омӯзиш дар ин соҳа як сафари давомдор аст, на чизе, ки як бор рух медиҳад ва анҷом меёбад. Мисоли мисол: Касе аз дастаи ман пурсид, ки оё метавон гуфт, ки оё корбарон аз ҷадвали мушаххаси UI дур мешаванд ё не. Ман ҳодисаи пеш аз боркунии JavaScript-ро қайд кардам. Аммо онҳое, ки қаблан ин масъаларо ҳал карда буданд, медонанд, ки ин имконпазир аст, зеро онҳо дар бораи маълумоти захиранашуда дар сайтҳои дигар огоҳӣ гирифтаанд, ки барои онҳо пеш аз бор кардан як ҳолати маъмулии истифода аст. Ман инчунин ба ҳамтои худ рӯйдодҳои саҳифаи Пинҳон ва visibilityChange-ро барои андозагирии хуб нишон додам. Ман дар ин бора аз куҷо медонистам? Зеро он дар як лоиҳаи дигар пайдо шудааст, на аз он сабаб, ки ман ҳангоми омӯзиши JavaScript дар аввал онро омӯхта будам. Далели он аст, ки чаҳорчӯбаҳои муосири пешрафта дар дӯши бузургҷуссаҳои технологӣ, ки пеш аз онҳо буданд, истодаанд. Онҳо таҷрибаҳои таҳияи абстрактӣ, аксар вақт барои таҷрибаи беҳтари таҳиякунанда, ки зарурати донистан ё ламс кардани он чизеро, ки ба таври анъанавӣ мафҳумҳои асосии фронталӣ буданд, эҳтимол ҳама бояд донанд, коҳиш медиҳанд ё ҳатто бартараф мекунанд. Модели объекти CSS (CSSOM) -ро баррасӣ кунед. Шумо шояд интизор шавед, ки ҳар касе, ки дар CSS ва JavaScript кор мекунад, як қатор таҷрибаи амалии CSSOM дорад, аммо ин на ҳамеша чунин хоҳад буд. Лоиҳаи React барои як сайти тиҷорати электронӣ вуҷуд дошт, ки ман дар он кор мекардам, ки дар он ҷо мо бояд ҷадвали услубро барои провайдери пардохти интихобшуда бор кунем. Мушкилот дар он буд, ки ҷадвали услуб дар ҳар саҳифа бор карда мешуд, вақте ки он танҳо дар як саҳифаи мушаххас лозим буд. Таҳиягаре, ки барои анҷом додани ин вазифа гузошта шудааст, ҳеҷ гоҳ ҷадвали услубро ба таври динамикӣ бор накардааст. Боз ҳам, ин комилан фаҳмо аст, вақте ки React равиши анъанавие, ки шумо ба он расида будед, абстракт мекунад. CSSOM эҳтимол чизе нест, ки ба шумо дар кори ҳаррӯзаи шумо лозим аст. Аммо эҳтимол дорад, ки ба шумо лозим меояд, ки бо он дар як лаҳза, ҳатто дар як маврид муошират кунед. Ин таҷрибаҳо маро ба навиштани ин мақола илҳом бахшид. Дар табиат бисёр хусусиятҳои веб ва технологияҳои мавҷуда мавҷуданд, ки шумо ҳеҷ гоҳ бевосита дар кори ҳаррӯзаи худ даст назанед. Шояд шумо дар таҳияи веб хеле нав ҳастед ва аз онҳо бехабаред, зеро шумо дар абстраксияи чаҳорчӯбаи мушаххасе, ки аз шумо донистани он амиқ ва ҳатто тамоман талаб намекунад, ғарқ шудаед. Ман махсусан дар бораи XML ҳарф мезанам, ки бисёре аз мо медонем, ки забони қадимӣ аст, ки аз HTML комилан фарқ надорад. Ман инро аз сабаби баҳсҳои охирини WHATWG ба миён меорам, ки пешниҳод мекунанд, ки як қисми зиёди стеки XML бо номи барномасозии XSLT аз браузерҳо хориҷ карда шавад. Ин маҳз як навъ технологияи кӯҳна ва мавҷудаест, ки мо солҳои тӯлонӣ доштем, ки онро метавон барои як чизи амалӣ ҳамчун вазъияти CSSOM, ки дастаи ман дар он буд, истифода бурд. Оё шумо қаблан бо XSLT кор кардаед? Биёед бубинем, ки оё мо ба ин технологияи кӯҳна такя мекунем ва хусусиятҳои онро берун аз контексти XML барои ҳалли мушкилоти воқеии имрӯза истифода мебарем. XPath: API-и марказӣ Муҳимтарин технологияи XML, ки шояд берун аз дурнамои мустақими XML муфидтар бошад, XPath аст, забони пурсиш, ки ба шумо имкон медиҳад, ки ягон гиреҳ ё атрибут дар дарахти аломатгузорӣ бо як унсури реша пайдо кунед. Ман ба XSLT як дилбастагии шахсӣ дорам, аммо ин ҳам ба XPath такя мекунад ва муҳаббати шахсӣ бояд дар аҳамияти рейтингӣ ҷудо карда шавад. Далел барои нест кардани XSLT дар бораи XPath ёдовар намешавад, бинобар ин ман фикр мекунам, ки он ҳоло ҳам иҷозат аст. Ин хуб аст, зеро XPath марказӣ ва муҳимтарин API дар ин маҷмӯи технологияҳо мебошад, хусусан ҳангоми кӯшиши пайдо кардани чизе барои истифода берун аз истифодаи муқаррарии XML. Муҳим аст, зеро дар ҳоле ки селекторҳои CSS-ро барои дарёфти аксари унсурҳои саҳифаи шумо истифода бурдан мумкин аст, онҳо ҳамаи онҳоро ёфта наметавонанд. Ғайр аз он, селекторҳои CSS-ро барои дарёфти унсур дар асоси мавқеи ҷории он дар DOM истифода бурдан мумкин нест. XPath метавонад. Ҳоло, баъзеи шумо инро хонда истодаед, шояд XPath-ро донад, ва баъзеҳо не. XPath як майдони хеле бузурги технология аст ва ман аслан наметавонам ҳама асосҳоро таълим диҳам ва инчунин ба шумо чизҳои ҷолиберо, ки бо он кор кардан лозим аст, дар як мақолаи монанди ин нишон диҳам. Ман аслан кӯшиш кардам, ки ин мақоларо нависам, аммо нашрияи миёнаи Smashing Magazine аз 5000 калима зиёд нест. Ман аллакай зиёда аз он будам2000 калима дар ҳоле ки танҳо дар нимаи асосҳо. Ҳамин тавр, ман бо XPath ба корҳои аҷибе шурӯъ мекунам ва ба шумо якчанд истинодҳое медиҳам, ки шумо метавонед барои асосҳо истифода баред, агар шумо ин чизҳоро ҷолиб пайдо кунед. Омезиши XPath ва CSS XPath метавонад корҳои зиёдеро иҷро кунад, ки интихобкунандагони CSS ҳангоми дархости элементҳо наметавонанд. Аммо интихобкунандагони CSS инчунин метавонанд якчанд корҳоеро иҷро кунанд, ки XPath наметавонанд, яъне унсурҳоро аз рӯи номи синф дархост кунанд.
CSS XPath .myClass /*[дорои (@класс, "синфи ман")]
Дар ин мисол, CSS унсурҳоеро, ки номи синфи .myClass доранд, дархост мекунад. Дар ҳамин ҳол, мисоли XPath унсурҳоеро, ки дорои синфи атрибутӣ бо сатри "myClass" мебошанд, дархост мекунад. Ба ибораи дигар, он унсурҳоро бо myClass дар ҳама гуна атрибут интихоб мекунад, аз ҷумла унсурҳои дорои номи синфи .myClass — инчунин унсурҳои дорои “myClass” дар сатр, ба монанди .myClass2. XPath ба ин маъно васеътар аст. Пас, не. Ман пешниҳод намекунам, ки мо бояд CSS-ро партоем ва интихоби ҳама унсурҳоро тавассути XPath оғоз кунем. Гап дар ин нест. Гап дар он аст, ки XPath метавонад корҳоеро иҷро кунад, ки CSS наметавонанд ва ҳоло ҳам хеле муфид буда метавонанд, гарчанде ки он технологияи кӯҳна дар стек браузер аст ва дар назари аввал аён набошанд. Биёед ду технологияро якҷоя истифода барем, на танҳо аз он сабаб, ки мо метавонем, балки аз он сабаб, ки мо дар ин раванд чизе дар бораи XPath меомӯзем ва онро як асбоби дигар дар стеки худ мегардонем - он чизе, ки шумо ҳамеша дар он ҷо будед, намедонистед! Мушкилот дар он аст, ки усули document.evaluate-и JavaScript ва усулҳои гуногуни интихоби дархост, ки мо бо API-ҳои CSS барои JavaScript истифода мебарем, номувофиқанд. Ман як API-и мувофиқи дархостро барои оғоз кардани мо сохтам, гарчанде ки иқрор шуд, ман дар ин бора бисёр фикр накардаам, зеро ин дур шудан аз коре, ки мо дар ин ҷо мекунем. Ин аст як мисоли кории хеле соддаи созандаи дархости такрорӣ: Ба Pen queryXPath [forked] аз ҷониби Брайан Расмуссен нигаред. Ман ду усулро дар объекти ҳуҷҷат илова кардам: queryCSSSelectors (ки аслан querySelectorAll аст) ва queryXPaths. Ҳардуи ин объекти queryResults -ро бармегардонанд:
{ навъи query: гиреҳҳо | сатр | рақам | булӣ, натиҷаҳо: any[] // унсурҳои html, унсурҳои xml, сатрҳо, рақамҳо, логикӣ, queryCSSSelectors: (дархост: сатр, ислоҳ: boolean) => queryResults, queryXpaths: (дархост: сатр, ислоҳ: boolean) => queryResults }
Функсияҳои queryCSSSelectors ва queryXpaths дархостеро иҷро мекунанд, ки шумо ба онҳо аз болои элементҳои массиви натиҷаҳо медиҳед, ба шарте ки массиви натиҷаҳо аз гиреҳҳои навъи бошад. Дар акси ҳол, он queryResult-ро бо массиви холӣ ва навъи гиреҳҳо бармегардонад. Агар хосияти ислоҳ ба true муқаррар карда шавад, функсияҳо queryResults-и худро тағир медиҳанд. Дар ҳеҷ ваҷҳ набояд онро дар муҳити истеҳсолӣ истифода бурд. Ман ин корро танҳо барои нишон додани эффектҳои гуногуни истифодаи ду API-и дархост дар якҷоягӣ иҷро мекунам. Намунаи дархостҳо Ман мехоҳам чанд намунаи дархостҳои XPath-ро нишон диҳам, ки баъзе чизҳои пурқувватеро, ки онҳо метавонанд иҷро кунанд ва чӣ гуна онҳоро ба ҷои равишҳои дигар истифода бурдан мумкин аст, нишон медиҳанд. Мисоли аввал //li/text() аст. Ин ҳама унсурҳои li-ро дархост мекунад ва гиреҳҳои матнии онҳоро бармегардонад. Ҳамин тавр, агар мо HTML-и зеринро дархост кунем:
- як
- ду
- се
... ин аст он чизе ки баргардонида мешавад:
{"queryType":"xpathEvaluate","results":["як","ду","се"],"resultType":"string"}
Ба ибораи дигар, мо массиви зеринро мегирем: ["як", "ду", "се"]. Одатан, шумо бояд унсурҳои li-ро дархост кунед, то онро ба даст оред, натиҷаи он дархостро ба массив табдил диҳед, массивро харита кунед ва гиреҳи матнии ҳар як элементро баргардонед. Аммо мо метавонем инро бо XPath ба таври мухтасар иҷро кунем: document.queryXPaths("//li/text()").натиҷаҳо.
Аҳамият диҳед, ки роҳи ба даст овардани гиреҳи матн ин истифодаи text() аст, ки ба имзои функсия монанд аст - ва он аст. Он гиреҳи матнии элементро бармегардонад. Дар мисоли мо, дар аломатгузорӣ се унсури li мавҷуд аст, ки ҳар кадоми онҳо матн доранд («як», «ду» ва «се»).
Биёед боз як мисоли дархости text()-ро дида бароем. Фарз мекунем, ки ин нишонаи мост:
Биёед дархосте нависем, ки арзиши аттрибути href-ро бармегардонад: document.queryXPaths("//a[text() = 'Ворид шудан']/@href").натиҷаҳо.
Ин як дархости XPath дар ҳуҷҷати ҷорӣ аст, мисли мисоли охирин, аммо ин дафъа мо аттрибути href-и истинодро (элемент), ки матни "Воридшавӣ"-ро дар бар мегирад, бармегардонем. Воқеан баргаштнатиҷа ["/login.html"] аст. Баррасии функсияҳои XPath Як қатор функсияҳои XPath мавҷуданд ва шумо эҳтимол бо онҳо шинос набошед. Якчанд чизҳое ҳастанд, ки ман фикр мекунам, ки дар бораи онҳо донистан лозим аст, аз ҷумла:
starts-withАгар матн бо мисоли дигари матн оғоз шавад, starts-with(@href, 'http:') дурустро бармегардонад, агар аттрибути href бо http: оғоз шавад. дарбаргирандаАгар матн як мисоли дигари матнро дар бар гирад, дорои(text(), "Smashing Magazine") ҳақиқиро бармегардонад, агар гиреҳи матн дар ҳама ҷо калимаҳои "Smashing Magazine" дошта бошад. count Шумораи мувофиқати чанд дархостро бар мегардонад. Масалан, count(//*[starts-with(@href, 'http:']) ҳисобро бар мегардонад, ки чанд истинод дар гиреҳи контекст дорои унсурҳои дорои аттрибути href аст, ки матни бо http: оғозшударо дар бар мегирад. substring ба монанди зерсатри JavaScript кор мекунад, ба истиснои он ки шумо сатрро ҳамчун аргумент интиқол медиҳед. Масалан, substring("матни ман", 2, 4) "y t" -ро бармегардонад. substring-beforeҚисми сатрро пеш аз сатри дигар бармегардонад. Масалан, substing-befor("матни ман", " ") "ман"-ро бармегардонад. Ба ҳамин монанд, substring-before("hi","bye") сатри холӣ бар мегардонад. substring-after Қисми сатрро пас аз сатри дигар бармегардонад. Масалан, substing-after("матни ман", " ") "матн"-ро бармегардонад. Ба ҳамин монанд, substring-after("hi","bye") сатри холиро бармегардонад. normalize-space Сатри аргументро бо фазои холӣ, ки тавассути тоза кардани фазои пешбар ва паси ва иваз кардани пайдарпайии аломатҳои холигӣ бо як фосила ба эътидол оварда шудааст, бармегардонад. notАгар аргумент бардурӯғ бошад, ҳақиқии мантиқиро бармегардонад, дар акси ҳол дурӯғ. trueБолеи ҳақиқиро бармегардонад. false Бармегардонад мантиқии дурӯғ. concatҲамон чиз бо JavaScript concat, магар он ки шумо онро ҳамчун усул дар сатр иҷро намекунед. Ба ҷои ин, шумо ҳамаи сатрҳоеро, ки мехоҳед пайваст кунед, ҷойгир кунед. string-lengthИн бо дарозии сатри JavaScript нест, балки дарозии сатри ҳамчун далел додашударо бармегардонад. translateThis сатр мегирад ва далели дуюмро ба далели сеюм иваз мекунад. Масалан, translate("abcdef", "abc", "XYZ") XYZdef-ро мебарорад.
Ба ғайр аз ин функсияҳои махсуси XPath, як қатор функсияҳои дигаре мавҷуданд, ки ҳамон тавре ки ҳамтоёни JavaScript-и худ кор мекунанд - ё ҳамтоҳои асосан дар ҳама гуна забони барномасозӣ - шумо эҳтимол онҳоро муфид хоҳед ёфт, ба монанди фарш, шифт, мудаввар, ҷамъ ва ғайра. Намоиши зерин ҳар яке аз ин функсияҳоро нишон медиҳад: Ба Функсияҳои ададии Pen XPath аз ҷониби Брайан Расмуссен нигаред. Дар хотир доред, ки ба монанди аксари функсияҳои коркарди сатр, бисёре аз функсияҳои ададӣ як вурудро мегиранд. Ин, албатта, аз он сабаб аст, ки онҳо бояд барои пурсиш истифода шаванд, ба мисли мисоли охирини XPath: //li[ошёна(матн()) > 250]/@val
Агар шумо онҳоро истифода баред, мисли аксари мисолҳо, шумо онро дар гиреҳи аввал, ки ба роҳ мувофиқат мекунад, иҷро мекунед. Инчунин баъзе функсияҳои табдилдиҳии намудҳо мавҷуданд, ки шумо бояд аз эҳтимол дурӣ ҷӯед, зеро JavaScript аллакай мушкилоти табдилдиҳии навъи худро дорад. Аммо вақтҳое мешаванд, ки шумо мехоҳед сатрро ба рақам табдил диҳед, то онро бо рақами дигар тафтиш кунед. Функсияҳое, ки намуди чизеро муқаррар мекунанд, мантиқӣ, рақам, сатр ва гиреҳ мебошанд. Инҳо намудҳои муҳими додаҳои XPath мебошанд. Ва тавре ки шумо тасаввур карда метавонед, аксари ин функсияҳоро дар намудҳои додаҳо истифода бурдан мумкин аст, ки гиреҳҳои DOM нестанд. Масалан, substring-after сатрро мегирад, тавре ки мо аллакай фаро гирифтаем, аммо он метавонад сатри атрибути href бошад. Он инчунин метавонад танҳо як сатр бошад:
const testSubstringAfter = document.queryXPaths("substring-after('салом ҷаҳон',' ')");
Аён аст, ки ин мисол ба мо массиви натиҷаҳоро ҳамчун ["ҷаҳон"] бармегардонад. Барои нишон додани ин дар амал, ман бо истифода аз функсияҳо бар зидди чизҳое, ки гиреҳҳои DOM нестанд, як саҳифаи намоишӣ сохтам: Ба Pen queryXPath [forked] аз ҷониби Брайан Расмуссен нигаред. Шумо бояд ҷанбаи ҳайратангези функсияи тарҷумаро қайд кунед, ки агар шумо дар аргументи дуюм аломат дошта бошед (яъне рӯйхати аломатҳое, ки шумо тарҷума кардан мехоҳед) ва ягон аломати мувофиқ барои тарҷума кардан надошта бошед, он аломат аз баромад хориҷ карда мешавад. Ҳамин тариқ, ин:
translate('Салом, Номи ман Иниго Монтоя, ту падарамро куштӣ, ба мурдан тайёрӣ','abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ,','*')
… натиҷаҳо дар сатр, аз ҷумла фосилаҳо: [" * * ** "]
Ин маънои онро дорад, ки ҳарфи "а" ба ситорача (*) тарҷума мешавад, аммо ҳар аломати дигаре, ки тарҷумаи сатри ҳадаф надорад, комилан хориҷ карда мешавад. Фазои сафед ҳама чизест, ки мо боқӣ мондаембайни аломатхои «а» тарчумашуда. Боз ин пурсиш:
translate('Салом, Номи ман Иниго Монтоя, ту падарамро куштӣ, ба мурдан тайёрӣ','abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ,','****************************************************************)")
… мушкилот надорад ва натиҷае медиҳад, ки чунин менамояд:
"***** ** **** ** ***** ******* *** ****** ** ******** ******* ** ***"
Шояд ба шумо тааҷҷуб кунад, ки дар JavaScript роҳи осони иҷрои маҳз он чизе, ки функсияи тарҷумаи XPath иҷро намекунад, вуҷуд надорад, гарчанде ки барои бисёр мавридҳои истифодабарӣ, replaceAll бо ибораҳои муқаррарӣ метавонад онро ҳал кунад. Шумо метавонед ҳамон равишеро, ки ман нишон додам, истифода баред, аммо ин ғайриоддӣ аст, агар шумо танҳо тарҷумаи сатрҳоро мехоҳед. Намоиши зерин функсияи тарҷумаи XPath-ро барои пешниҳоди версияи JavaScript фаро мегирад: Ба Функсияи тарҷумаи қалам аз ҷониби Брайан Расмуссен нигаред. Дар куҷо шумо метавонед чунин чизеро истифода баред? Рамзгузории Caesar Cipher-ро бо ҷуброни се ҷойгоҳ баррасӣ кунед (масалан, рамзгузории беҳтарин аз соли 48 то милод):
translate("Сезар ният дорад аз Рубикон убур кунад!", "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz", "XYZABCDEFGHIJKLMNOPQRSTUVWxyzabcdefghijklmnopqrstuvw")
Матни вуруди "Цезарь ният дорад аз Рубикон убур кунад!" натиҷаҳо дар "Zxbpxo fp mixkkfkd ql zolpp qeb Oryfzlk!" Барои мисоли дигари фаврӣ аз имкониятҳои гуногун, ман як функсияи металлиро сохтам, ки вуруди сатрро мегирад ва функсияи тарҷумаро барои баргардонидани матн, аз ҷумла ҳамаи аломатҳое, ки umlaut мегиранд, истифода мебарад. Функсияи металлии қаламро аз ҷониби Брайан Расмуссен бубинед.
const metal = (str) => { баргардонидани тарҷума (кӯч, "AOUaou", "ÄÖÜäöü"); }
Ва, агар матни "Мотли Кру қоидаҳо, рок бар дудес!" дода шавад, бармегардад "Мотли Крю рулес, röck on dudes!" Аён аст, ки кас метавонад ҳама гуна истифодаҳои пародиявии ин функсия дошта бошад. Агар ин шумо бошед, пас ин мақолаи TVTropes бояд ба шумо илҳоми фаровон диҳад. Истифодаи CSS бо XPath Сабаби асосии истифодаи селекторҳои CSS-ро дар якҷоягӣ бо XPath дар хотир нигоҳ доред: CSS хеле хуб мефаҳмад, ки синф чист, дар ҳоле ки беҳтарин чизе, ки шумо бо XPath карда метавонед, ин муқоисаи сатри атрибути синф аст. Ин дар аксари ҳолатҳо кор хоҳад кард. Аммо агар шумо ягон вақт бо вазъияте рӯ ба рӯ мешудед, ки масалан, касе дарсҳо бо номи .primaryLinks ва .primaryLinks2 эҷод мекард ва шумо XPath-ро барои гирифтани синфи .primaryLinks истифода мебурдед, эҳтимол ба мушкилот дучор мешавед. То он даме, ки ҳеҷ чизи беақл нест, шумо эҳтимол XPath-ро истифода мебаред. Аммо ман бо таассуф хабар медиҳам, ки ман дар ҷойҳое кор кардаам, ки одамон ин гуна корҳои аблаҳона мекунанд. Ин як намоиши дигарест, ки CSS ва XPath-ро якҷоя истифода мебаранд. Он нишон медиҳад, ки вақте ки мо кодро барои иҷро кардани XPath дар гиреҳи контекстӣ, ки гиреҳи ҳуҷҷат нест, истифода мебарем, чӣ мешавад. Pen css ва xpath-ро якҷоя бинед [форкшуда] аз ҷониби Брайан Расмуссен. Дархости CSS .relatedarticles a мебошад, ки ду унсури a-ро дар div, ки ба синфи .relatedarticles таъин шудааст, меорад. Пас аз он се дархости "бад" ҳастанд, яъне дархостҳое, ки ҳангоми кор бо ин унсурҳо ҳамчун гиреҳи контекст кореро, ки мо мехоҳем, иҷро намекунанд. Ман метавонам фаҳмонам, ки чаро онҳо аз он чи ки шумо интизор будед, дигар хел рафтор мекунанд. Се саволи бади мавриди назар инҳоянд:
//text(): Ҳамаи матни ҳуҷҷатро бармегардонад. //a/text(): Тамоми матни дохили пайвандҳо дар ҳуҷҷатро бармегардонад. ./a/text(): Ягон натиҷа намедиҳад.
Сабаби ин натиҷаҳо дар он аст, ки дар ҳоле ки контексти шумо унсурҳои аз дархости CSS баргардонидашуда аст, // муқобили тамоми ҳуҷҷат аст. Ин қувваи XPath аст; CSS наметавонад аз гиреҳ то ба аҷдод ва сипас ба бародари он аҷдод гузарад ва ба насли он бародар равад. Аммо XPath метавонад. Дар ҳамин ҳол, ./ кӯдакони гиреҳи ҷорӣро дархост мекунад, ки дар он нуқта (.) гиреҳи ҷориро ифода мекунад ва хати рост (/) рафтан ба ягон гиреҳи кӯдакро ифода мекунад - оё он атрибут, элемент ё матн аст, аз ҷониби қисми навбатии роҳ муайян карда мешавад. Аммо ягон кӯдаке, ки аз ҷониби дархости CSS интихоб шудааст, вуҷуд надорад, бинобар ин он дархост низ чизе барнамегардонад. Дар ин намоиши охирин се саволи хуб мавҷуд аст:
.//text(), ./text(), normalize-фосила (./text ()).
Дархости normalize-space истифодаи функсияи XPath-ро нишон медиҳад, аммо инчунин мушкилоти дар дархостҳои дигар дохилшударо ҳал мекунад. HTML чунин сохта шудааст:
Автоматикунонии санҷиши хусусиятҳои шумо бо Selenium WebDriver
Дархост як канали сатрро дар аввал ва охири гиреҳи матн бармегардонад,ва нормализация-фазо инро бартараф мекунад. Истифодаи ҳама гуна функсияи XPath, ки чизи дигареро ба ҷуз мантиқӣ бо вуруди XPath бармегардонад, ба дигар вазифаҳо дахл дорад. Намоиши зерин як қатор мисолҳоро нишон медиҳад: Ба мисолҳои функсияҳои Pen xpath аз ҷониби Брайан Расмуссен нигаред. Мисоли аввал мушкилотеро нишон медиҳад, ки шумо бояд ба он диққат диҳед. Махсусан, рамзи зерин:
document.queryXPaths("substring-after(//a/@href,'https://')");
…як сатрро бармегардонад:
"www.smashingmagazine.com/2018/04/feature-testing-selenium-webdriver/"
Ин маъно дорад, дуруст? Ин функсияҳо на массивҳоро, балки сатрҳои ягона ё рақамҳои ягонаро бармегардонанд. Иҷрои функсия дар ҳама ҷо бо натиҷаҳои сершумор танҳо натиҷаи аввалро бармегардонад. Натиҷаи дуюм нишон медиҳад, ки мо дар ҳақиқат чӣ мехоҳем:
document.queryCSSSelectors("a").queryXPaths("substring-after(./@href,'https://')");
Ки массив аз ду сатрро бармегардонад:
["www.smashingmagazine.com/2018/04/feature-testing-selenium-webdriver/","www.smashingmagazine.com/2022/11/automated-test-results-improve-accessibility/"]
Функсияҳои XPath метавонанд мисли функсияҳои JavaScript ҷойгир карда шаванд. Ҳамин тавр, агар мо сохтори URL-и Smashing Magazine-ро донем, мо метавонем амалҳои зеринро иҷро кунем (бо истифода аз матнҳои шаблон тавсия дода мешавад): `тарҷума ( зерсатр ( substring-after(./@href, 'www.smashingmagazine.com/') ,9), '/','')`
Ин ба дараҷае хеле мураккаб шуда истодааст, ки ба шарҳҳое ниёз дорад, ки чӣ кор мекунад: ҳама URL-ро аз атрибути href пас аз www.smashingmagazine.com/ бигиред, нӯҳ аломати аввалро хориҷ кунед, сипас аломати слэш (/)-ро ба ҳеҷ чиз тарҷума накунед, то аз хатти охири пеш халос шавед. Массиви натиҷа:
["feature-testing-selenium-webdriver","автоматӣ-санҷиш-натиҷаҳои-беҳтар-дастрасӣ"]
Ҳолатҳои истифодаи XPath бештар XPath метавонад дар озмоиш воқеан дурахшид. Сабабро дидан душвор нест, зеро XPath метавонад барои гирифтани ҳар як унсури DOM аз ҳама мавқеъ дар DOM истифода шавад, дар ҳоле ки CSS наметавонад. Шумо наметавонед ба синфҳои CSS, ки дар бисёре аз системаҳои муосири созанда мувофиқат мекунанд, эътимод кунед, аммо бо XPath, мо метавонем мувофиқат кунем, ки мундариҷаи матни элементро новобаста аз сохтори тағирёбандаи DOM чӣ гуна аст, мувофиқат кунем. Дар бораи усулҳое, ки ба шумо имкон медиҳанд санҷишҳои устувори XPath анҷом диҳед, тадқиқот гузаронида шуд. Ҳеҷ чиз бадтар аз он нест, ки санҷишҳо шикаста шаванд ва ноком шаванд, зеро селектори CSS дигар кор намекунад, зеро чизе иваз карда шудааст ё нест карда шудааст. XPath инчунин дар истихроҷи локаторҳои сершумор воқеан хуб аст. Зиёда аз як роҳи истифодаи дархостҳои XPath барои мувофиқат кардани элемент вуҷуд дорад. Бо CSS низ ҳамин тавр аст. Аммо дархостҳои XPath метавонанд чизҳоро ба таври мақсадноктар парма кунанд, ки он чизеро, ки баргардонида мешаванд, маҳдуд мекунад ва ба шумо имкон медиҳад, ки мувофиқати мушаххасеро пайдо кунед, ки дар он ҷо якчанд мувофиқати имконпазир вуҷуд дорад. Масалан, мо метавонем XPath-ро барои баргардонидани як унсури мушаххаси h2 истифода барем, ки дар дохили div мавҷуд аст, ки фавран аз div-и бародар пайравӣ мекунад, ки дар навбати худ унсури тасвири кӯдакро бо атрибути data-testID="leader" дар он дар бар мегирад:
ин сарлавҳаро нагиред
Ин сарлавҳаро ҳам нагиред
Сарлавҳа барои тасвири пешво
Ин аст пурсиш: document.queryXPaths(` //div[ бародари зерин ::div[1] /img[@data-testID='лидер'] ] /h2/ матн () `);
Биёед як намоишро гузорем, то бубинем, ки ин ҳама якҷоя мешавад: Ба дархости Pen Complex H2 аз ҷониби Брайан Расмуссен нигаред. Пас, бале. Роҳҳои зиёди имконпазир ба ҳама гуна элемент дар санҷиш бо истифода аз XPath мавҷуданд. XSLT 1.0 бекоркунӣ Ман барвақт қайд кардам, ки дастаи Chrome нақша дорад, ки дастгирии XSLT 1.0-ро аз браузер хориҷ кунад. Ин муҳим аст, зеро XSLT 1.0 барои табдили ҳуҷҷат барномасозии ба XML нигаронидашударо истифода мебарад, ки дар навбати худ ба XPath 1.0 такя мекунад, ки он чизест, ки дар аксари браузерҳо мавҷуд аст. Вақте ки ин рӯй медиҳад, мо ҷузъи асосии XPath-ро аз даст медиҳем. Аммо бо назардошти он, ки XPath барои навиштани санҷишҳо воқеан хуб аст, ман гумон мекунам, ки XPath дар маҷмӯъ ба зудӣ нест шавад. Ин гуфта буд, ки ман мушоҳида кардам, ки одамон ҳангоми гирифтани хусусият ба хусусият таваҷҷӯҳ зоҳир мекунанд. Ва ин бешубҳа дар мавриди бекор кардани XSLT 1.0 дуруст аст. Дар Hacker News як мубоҳисае идома дорад, ки бо далелҳои зидди бекоркунӣ пур шудааст. Худи ин паём як намунаи олии эҷоди чаҳорчӯбаи блогнависӣ бо XSLT мебошад. ШумоШумо метавонед муҳокимаро барои худ хонед, аммо он ба он меравад, ки чӣ гуна JavaScript-ро ҳамчун шинам барои XLST барои ҳалли ин гуна парвандаҳо истифода бурдан мумкин аст. Ман инчунин пешниҳодҳоро дидаам, ки браузерҳо бояд SaxonJS-ро истифода баранд, ки бандари JavaScript барои муҳаррикҳои Saxon XSLT, XQUERY ва XPath мебошад. Ин як идеяи ҷолиб аст, бахусус, зеро Saxon-JS версияи ҷории ин мушаххасотро амалӣ мекунад, дар ҳоле ки ягон браузере вуҷуд надорад, ки ягон версияи XPath ё XSLT-ро берун аз 1.0 амалӣ кунад ва ҳеҷ кас XQuery-ро амалӣ намекунад. Ман ба Норм Товей-Уолш дар Саксоника, ширкате, ки паси SaxonJS ва дигар муҳаррикҳои Saxon кор мекунад, муроҷиат кардам. Гуфт: "Агар ягон фурӯшандаи браузер манфиатдор бошад, ки SaxonJS-ро ҳамчун як нуқтаи ибтидоӣ барои ҳамгироии технологияҳои муосири XML ба браузер қабул кунад, мо бо онҳо бо хушнудӣ муҳокима хоҳем кард." - Норм Товей-Уолш
Аммо илова кард: "Агар касе фикр мекард, ки SaxonJS-ро дар шакли ҳозирааш ва бетағйир гузоштани он ба браузери сохтани браузер равиши беҳтарин хоҳад буд. Ман хеле ҳайрон мешудам. Фурӯшандаи браузер, аз рӯи табиати он, ки онҳо браузерро месозанд, метавонад ба ҳамгироӣ дар сатҳи амиқтар наздиктар шавад, нисбат ба мо "аз берун"." - Норм Товей-Валш.
Қобили зикр аст, ки шарҳҳои Товей-Уолш тақрибан як ҳафта пеш аз эълони бекоркунии XSLT омадаанд. Хулоса Ман метавонистам идома диҳам. Аммо ман умедворам, ки ин қудрати XPath-ро нишон дод ва ба шумо мисолҳои зиёде дод, ки чӣ тавр истифода бурдани онро барои ноил шудан ба чизҳои бузург нишон медиҳанд. Ин як намунаи комили технологияи кӯҳна дар стеки браузер аст, ки имрӯз ҳам фоидаи фаровон дорад, ҳатто агар шумо ҳеҷ гоҳ мавҷудияти онро намедонистед ё ҳеҷ гоҳ фикр накарда бошед, ки ба он дастрасӣ пайдо кунед. Хониши минбаъда
"Беҳтар кардани устувории санҷишҳои автоматии веб бо забони табиӣ" (Китобхонаи рақамии ACM) аз ҷониби Марун Айлӣ, Юсуф Бакунӣ, Надер Ҷалол ва Рима Килани Ин мақола мисолҳои зиёди XPath барои навиштани санҷишҳои устуворро пешниҳод мекунад. XPath (MDN) Ин ҷои хубест барои оғоз, агар шумо хоҳед, ки шарҳи техникӣ дар бораи чӣ гуна кор кардани XPath дошта бошед. XPath Tutorial (ZVON) Ман ба шарофати фаровонии мисолҳо ва тавзеҳоти возеҳ ин дастурро дар омӯзиши шахсии худ бештар муфид донистам. XPatherИн абзори интерактивӣ ба шумо имкон медиҳад, ки мустақиман бо код кор кунед.