Tá mé i bhforbairt tosaigh fada go leor chun treocht a fheiceáil thar na blianta: forbróirí níos óige ag obair le paraidím nua cláir gan tuiscint a fháil ar a chomhthéacs stairiúil. Ar ndóigh, tá sé intuigthe go foirfe gan a bheith ar an eolas faoi rud éigin. Is áit an-mhór é an gréasán le sraith scileanna agus speisialtachtaí éagsúla, agus ní bhíonn a fhios againn i gcónaí cad nach bhfuil ar eolas againn. Is aistear leanúnach í an fhoghlaim sa réimse seo seachas rud a tharlaíonn uair amháin agus a chríochnaíonn. Cás i bpointe: D'iarr duine éigin ar m'fhoireann an raibh sé indéanta a insint an bhfuil úsáideoirí ag nascleanúint ó chluaisín ar leith san Chomhéadain. Luaigh mé imeacht JavaScript roimh díluchtú. Ach tá a fhios acu siúd a chuaigh i ngleic leis seo roimhe seo go bhfuil sé seo indéanta toisc go bhfuil siad buailte le foláirimh faoi shonraí nár sábháladh ar shuímh eile, ar cás úsáide tipiciúil é roimh an díluchtú. Chuir mé na himeachtaí leathanachHide agus visibilityChange in iúl do mo chomhghleacaí ar mhaithe le beart maith. Conas a bhí a fhios agam faoi sin? Toisc gur tháinig sé aníos i dtionscadal eile, ní toisc go ndearna mé staidéar air agus mé ag foghlaim JavaScript ar dtús. Is é fírinne an scéil go bhfuil creataí tosaigh nua-aimseartha ina seasamh ar ghuaillí na bhfathach teicneolaíochta a tháinig rompu. Teibríonn siad cleachtais forbartha, go minic le haghaidh eispéireas forbróra níos fearr a laghdaíonn, nó fiú a chuireann deireadh leis, an gá le fios a bheith acu nó teagmháil a dhéanamh le coincheapa bunriachtanacha a bhí go traidisiúnta ar cheart go mbeadh a fhios ag gach duine. Smaoinigh ar Shamhail Oibiachta CSS (CSSOM). Seans go mbeifeá ag súil go mbeidh go leor taithí phearsanta CSSOM ag duine ar bith atá ag obair i CSS agus JavaScript, ach ní mar sin a bheidh an scéal i gcónaí. Bhí tionscadal React ann do shuíomh ríomhthráchtála ar oibrigh mé air nuair a theastaigh uainn stílbhileog a luchtú don soláthraí íocaíochta atá roghnaithe faoi láthair. An fhadhb a bhí ann ná go raibh an stílbhileog á lódáil ar gach leathanach nuair nach raibh sé ag teastáil i ndáiríre ach ar leathanach ar leith. Níor lódáil an forbróir ar cuireadh de chúram air seo a dhéanamh stílbhileog go dinimiciúil. Arís, tá sé seo intuigthe go hiomlán nuair a dhéanann React achoimre ar an gcur chuige traidisiúnta a d’fhéadfá a bheith bainte amach agat. Is dócha nach rud é an CSSOM a theastaíonn uait i do chuid oibre laethúil. Ach is dócha go mbeidh ort idirghníomhú leis ag pointe éigin, fiú i gcás aonuaire. Spreag na heispéiris seo mé chun an t-alt seo a scríobh. Tá go leor gnéithe agus teicneolaíochtaí gréasáin ann cheana féin san fhiántas nach mbainfeá leo go deo i do chuid oibre ó lá go lá. B’fhéidir go bhfuil tú nua go leor maidir le forbairt gréasáin agus nach bhfuil tú ar an eolas fúthu toisc go bhfuil tú sáite i gcreat sonrach a astarraingt nach gá duit eolas domhain a bheith agat air, nó fiú ar chor ar bith. Táim ag caint go sonrach faoi XML, a bhfuil a fhios ag go leor againn gur teanga ársa í nach bhfuil difriúil go hiomlán ó HTML. Táim á thabhairt suas seo mar gheall ar phlé WHATWG le déanaí a thug le tuiscint gur cheart smután suntasach den chruach XML ar a dtugtar ríomhchlárú XSLT a bhaint as brabhsálaithe. Is é seo go díreach an cineál teicneolaíochta níos sine atá ann cheana féin atá againn le blianta anuas a d’fhéadfaí a úsáid le haghaidh rud éigin chomh praiticiúil leis an staid CSSOM ina raibh m’fhoireann. Ar oibrigh tú le XSLT roimhe seo? Feicfimid an leanaimid go mór leis an teicneolaíocht níos sine seo agus an úsáidimid a gnéithe lasmuigh de chomhthéacs XML chun dul i ngleic le fadhbanna an tsaoil sa lá atá inniu ann. XPath: An API Lárnach Is í an teicneolaíocht XML is tábhachtaí atá b’fhéidir an ceann is úsáidí lasmuigh de pheirspictíocht dhíreach XML ná XPath, teanga fiosrúcháin a ligeann duit aon nód nó tréith a aimsiú i gcrann marcála le buneilimint amháin. Tá gean pearsanta agam do XSLT, ach braitheann sin freisin ar XPath, agus ní mór gean pearsanta a chur ar leataobh maidir le tábhacht rangú. Ní dhéanann an argóint ar son XSLT a bhaint aon trácht ar XPath, mar sin is dócha go gceadaítear é fós. Is maith sin mar is é XPath an API lárnach agus is tábhachtaí sa tsraith teicneolaíochtaí seo, go háirithe agus tú ag iarraidh rud éigin a aimsiú le húsáid lasmuigh de ghnáthúsáid XML. Tá sé tábhachtach mar, cé gur féidir roghnóir CSS a úsáid chun an chuid is mó de na heilimintí ar do leathanach a fháil, ní féidir leo iad go léir a aimsiú. Ina theannta sin, ní féidir roghnóirí CSS a úsáid chun eilimint a aimsiú bunaithe ar a staid reatha sa DOM. Is féidir XPath. Anois, seans go mbeadh XPath ar eolas ag cuid agaibh atá á léamh seo, agus b’fhéidir nach mbeadh. Is réimse mór teicneolaíochta é XPath, agus ní féidir liom na bunghnéithe go léir a mhúineadh i ndáiríre agus rudaí fionnuara a thaispeáint duit a bhaineann leis in alt amháin mar seo. Rinne mé iarracht an t-alt sin a scríobh, ach ní théann meánfhoilseachán Smashing Magazine thar 5,000 focal. Bhí mé cheana féin ag níos mó ná2,000 focal agus gan ach leath bealaigh tríd an Basics. Mar sin, táim chun tús a chur le rudaí fionnuara a dhéanamh le XPath agus roinnt naisc a thabhairt duit ar féidir leat a úsáid le haghaidh na rudaí bunúsacha má tá an stuif seo suimiúil duit. XPath agus CSS a chomhcheangal Is féidir le XPath go leor rudaí a dhéanamh nach féidir le roghnóirí CSS agus gnéithe á bhfiosrú acu. Ach is féidir le roghnóirí CSS roinnt rudaí a dhéanamh freisin nach féidir le XPath, eadhon, ceisteanna a chur ar eilimintí de réir ainm ranga.

CSS XPath .myRang /*[tá (@rang, "myRang")]

Sa sampla seo, cuireann CSS ceisteanna ar eilimintí a bhfuil ainm ranga .myClass iontu. Idir an dá linn, ceistíonn sampla XPath gnéithe ina bhfuil aicme tréithe leis an teaghrán “myClass”. I bhfocail eile, roghnaíonn sé gnéithe le myClass in aon tréith, lena n-áirítear gnéithe a bhfuil an t-ainm ranga .myClass - chomh maith le heilimintí le "myClass" sa teaghrán, mar shampla .myClass2. Tá XPath níos leithne sa chiall sin. Mar sin, níl. Níl mé ag moladh gur chóir dúinn CSS a chaitheamh amach agus tús a chur le gach eilimint a roghnú trí XPath. Ní hé sin an pointe. Is é an pointe ná gur féidir le XPath rudaí a dhéanamh nach féidir le CSS a bheith an-úsáideach agus a d'fhéadfadh a bheith fós an-úsáideach, cé gur teicneolaíocht níos sine é i gcruach an bhrabhsálaí agus b'fhéidir nach cosúil go bhfuil sé soiléir ar an gcéad amharc. Úsáidfimid an dá theicneolaíocht le chéile, ní hamháin toisc gur féidir linn, ach toisc go bhfoghlaimeoimid rud éigin faoi XPath sa phróiseas, rud a fhágann gur uirlis eile é i do chairn - b'fhéidir nach raibh a fhios agat go raibh sé ann fadó! Is í an fhadhb atá ann go bhfuil modh document.evaluate JavaScript agus na modhanna éagsúla roghnóireachta fiosrúcháin a úsáidimid leis na CSS APIs do JavaScript neamh-chomhoiriúnach. Tá API ceistiúcháin comhoiriúnach déanta agam chun muid a chur ar bun, ach admhaítear, níl mórán machnaimh déanta agam air ós rud é go bhfuil sé ag imeacht ón méid atá ar siúl againn anseo. Seo sampla simplí oibre de chruthaitheoir fiosrúcháin in-athúsáidte: Féach an cheist PenXPath [forked] le Bryan Rasmussen. Tá dhá mhodh curtha agam leis an oibiacht doiciméad: queryCSSSelectors (arb é querySelectorAll é go bunúsach) agus queryXPaths. Tugann an dá rud seo réad queryResults ar ais:

{ cineál ceiste: nóid | teaghrán | uimhir | Boole, torthaí: aon eilimintí[] // html, eilimintí xml, teaghráin, uimhreacha, booleans, queryCSSSroghnóirí: (ceist: teaghrán, leasaigh: boolean) => queryResults, queryXpaths: (ceist: teaghrán, leasaigh: boolean) => queryResults }

Ritheann na queryCSSSroghnóirí agus feidhmeanna queryXpaths an cheist a thugann tú dóibh thar na heilimintí san eagar torthaí, chomh fada agus is nóid chineáil an eagar torthaí, ar ndóigh. Seachas sin, cuirfidh sé queryResult ar ais le sraith folamh agus cineál nóid. Má shocraítear go bhfuil an t-airí leasaithe fíor, athróidh na feidhmeanna a gcuid torthaí ceiste féin. Níor cheart é seo a úsáid i dtimpeallacht táirgthe in imthosca ar bith. Táim á dhéanamh ar an mbealach seo chun na héifeachtaí éagsúla a bhaineann le húsáid an dá API cheist le chéile a léiriú. Ceisteanna Samplacha Ba mhaith liom roinnt samplaí de cheisteanna éagsúla XPath a thaispeáint a léiríonn cuid de na rudaí cumhachtacha is féidir leo a dhéanamh agus conas is féidir iad a úsáid in ionad cuir chuige eile. Is é an chéad sampla //li/text(). Ceistíonn sé seo gach eilimint li agus cuireann sé a nóid téacs ar ais. Mar sin, dá mbeimis chun an HTML seo a leanas a cheistiú:

  • ceann
  • dhá
  • trí

…seo a thugtar ar ais:

{ "queryType": "xpathEvaluate", "torthaí":["ceann", "dhá", "trí"], "resultType": "teaghrán"}

I bhfocail eile, faigheann muid an t-eagar seo a leanas: ["aon", "dhá", "trí"]. Go hiondúil, chuirfeá ceist ar na heilimintí li chun é sin a fháil, toradh an fhiosrúcháin sin a iompú ina eagar, an t-eagar a mhapáil, agus nód téacs gach eilimint a thabhairt ar ais. Ach is féidir linn é sin a dhéanamh ar bhealach níos gonta le XPath: document.queryXPaths ("//li/text()").torthaí.

Tabhair faoi deara gurb é an bealach chun nód téacs a fháil ná téacs () a úsáid, a bhfuil cuma síniú feidhme air - agus tá sé. Filleann sé nód téacs dúil. Inár sampla, tá trí eilimint li sa mharcáil, gach ceann ina bhfuil téacs ("ceann", "dhá", agus "trí"). Breathnaímis ar shampla amháin eile de cheist téacs(). Glac leis gurb é seo ár marcáil: Sínigh isteach

Scríobhfaimid ceist a sheolann luach aitreabúide href ar ais: document.queryXPaths("//a[text() = 'Logáil isteach']/@href").torthaí.

Is ceist XPath é seo ar an doiciméad reatha, díreach cosúil leis an sampla deireanach, ach an uair seo tugaimid ar ais an aitreabúid href de nasc (eilimint) ina bhfuil an téacs “Sign In”. An iarbhír ar aisIs é an toradh ["/login.html"]. Forbhreathnú Feidhmeanna XPath Tá roinnt feidhmeanna XPath ann, agus is dócha nach bhfuil cur amach agat orthu. Tá go leor, sílim, ar fiú a bheith ar an eolas fúthu, lena n-áirítear iad seo a leanas:

start-with Má thosaíonn téacs le sampla téacs ar leith eile, filleann start-with(@href, 'http:') fíor má thosaíonn aitreabúid href le http:. ina bhfuil Má tá sampla téacs ar leith eile i dtéacs, filleann (téacs(), “Irisleabhar Briseadh”) fíor má tá na focail “Smashing Magazine” i nód téacs in áit ar bith. Comhair Filleann sé líon na meaitse atá ar cheist. Mar shampla, filleann count(//*[starts-with(@href, 'http:']) comhaireamh ar cé mhéad nasc sa nód comhthéacs a bhfuil gnéithe le tréith href ina bhfuil an téacs a thosaíonn leis an http:. substringWorks cosúil le fotheaghrán JavaScript, ach amháin má éiríonn leat an teaghrán mar argóint. Mar shampla, filleann substring ("mo téacs", 2, 4) "y t". substring-before Filleann sé an chuid de shreang roimh teaghrán eile. Mar shampla, filleann substing-before ("mo téacs", " ") "mo". Mar an gcéanna, cuireann substring-before ("hi", "beannacht") teaghrán folamh ar ais. substring-after Filleann sé an chuid de shreang i ndiaidh teaghrán eile. Mar shampla, cuireann substing-after ("mo théacs", " ") "téacs" ar ais. Ar an gcaoi chéanna, filleann substring-i ndiaidh ("Dia duit", "beannacht") teaghrán folamh. normalú-spaceFilleann sé teaghrán na hargóintí le spás bán normalaithe trí spás bán a stiúradh agus a rian agus spás singil a chur in ionad seichimh de charachtair spás bán. notReturns boolean fíor má tá an argóint bréagach, nó bréagach. fíor Filleann boolean fíor. falseReturns boolean bréagach. concatAn rud céanna le JavaScript concat, ach amháin ní ritheann tú é mar mhodh ar theaghrán. Ina áit sin, cuireann tú isteach na teaghráin go léir is mian leat a chomhcheangail. string-length Níl sé seo mar an gcéanna le fad teaghrán JavaScript, ach filleann sé fad na téad a thugtar dó mar argóint. translateTógann sé seo teaghrán agus athraíonn an dara argóint go dtí an tríú argóint. Mar shampla, aschuir translate ("abcdef", "abc", "XYZ") XYZdef.

Seachas na feidhmeanna XPath áirithe seo, tá roinnt feidhmeanna eile a oibríonn díreach mar an gcéanna lena gcomhghleacaithe JavaScript - nó a gcomhghleacaithe in aon teanga ríomhchlárúcháin go bunúsach - is dócha a bheadh úsáideach duit freisin, mar urlár, uasteorainn, cruinn, suim, agus mar sin de. Léiríonn an taispeántas seo a leanas gach ceann de na feidhmeanna seo: Féach feidhmeanna Uimhriúla Pen XPath [forked] le Bryan Rasmussen. Tabhair faoi deara, cosúil le formhór na bhfeidhmeanna ionramhála teaghrán, go nglacann go leor de na cinn uimhriúla ionchur amháin. Tá sé seo, ar ndóigh, toisc go bhfuil siad ceaptha a úsáid le haghaidh fiosrúcháin, mar atá sa sampla XPath deiridh: //li[urlár(téacs()) > 250]/@val

Má úsáideann tú iad, mar a dhéanann an chuid is mó de na samplaí, beidh tú ag rith ar an gcéad nód a mheaitseálann an cosán. Tá roinnt feidhmeanna comhshó cineál ann freisin ar chóir duit a sheachaint toisc go bhfuil a chuid fadhbanna comhshó cineál féin ag JavaScript cheana féin. Ach is féidir go mbeidh amanna ann nuair is mian leat teaghrán a thiontú go huimhir chun é a sheiceáil i gcoinne uimhir éigin eile. Is iad na feidhmeanna a shocraíonn an cineál ruda ná boolean, uimhir, téad, agus nód. Is iad seo na cineálacha sonraí tábhachtacha XPath. Agus mar a d'fhéadfá a shamhlú, is féidir an chuid is mó de na feidhmeanna seo a úsáid ar chineálacha sonraí nach nóid DOM iad. Mar shampla, glacann fotheaghrán tar éis teaghrán mar atá clúdaithe againn cheana féin, ach d'fhéadfadh sé a bheith mar an teaghrán ó tréith href. Is féidir leis a bheith ina sreang freisin:

const testSubstringAfter = document.queryXPaths("fotheideal i ndiaidh ('hello world',' ')");

Ar ndóigh, tabharfaidh an sampla seo ar ais dúinn an t-eagar torthaí mar ["domhan"]. Chun é seo a thaispeáint i ngníomh, tá leathanach taispeána déanta agam ag baint úsáide as feidhmeanna i gcoinne rudaí nach nóid DOM iad: Féach an cheist PenXPath [forked] le Bryan Rasmussen. Ba cheart duit an ghné iontas den fheidhm aistrithe a thabhairt faoi deara, is é sin má tá carachtar agat sa dara argóint (i.e., liosta na gcarachtar a theastaíonn uait a aistriú) agus gan aon charachtar meaitseála le haistriú chuige, bainfear an carachtar sin den aschur. Mar sin, seo:

translate('Dia duit, Inigo Montoya is ainm dom, mharaigh tú m'athair, ullmhaigh tú bás', 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ,','*')

…torthaí sa téad, lena n-áirítear spásanna: ["***"]

Ciallaíonn sé seo go bhfuil an litir “a” á haistriú go réiltín (*), ach go mbaintear go hiomlán gach carachtar eile nach bhfuil aistriúchán ag baint leis nuair a thugtar an sprioc-theaghrán. Is é an spás bán go léir atá fágtha againnidir na carachtair “a” aistrithe. Ansin arís, an cheist seo:

translate('Dia duit, Inigo Montoya is ainm dom, mharaigh tú m'athair, ullmhaigh tú bás', 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ,', '************************************************'))

…nach bhfuil an fhadhb aige agus aschuireann sé toradh atá cosúil le seo:

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

D'fhéadfadh sé a chur i bhfeidhm ort nach bhfuil aon bhealach éasca le JavaScript a dhéanamh go díreach cad a dhéanann an fheidhm aistrithe XPath, cé gur féidir le go leor cásanna úsáide a chur in ionad Gach le nathanna rialta é a láimhseáil. D’fhéadfá an cur chuige céanna atá léirithe agam a úsáid, ach tá sé sin suboptimal más rud é nach bhfuil uait ach na teaghráin a aistriú. Clúdaíonn an taispeántas seo a leanas feidhm aistrithe XPath chun leagan JavaScript a sholáthar: Féach an fheidhm aistrithe Peann [forked] le Bryan Rasmussen. Cá bhféadfá rud mar seo a úsáid? Smaoinigh ar chriptiú Caesar Cipher le fritháireamh trí áit (m.sh., criptiú barr-an-líne ó 48 R.Ch.):

translate("Tá Caesar ag beartú an Rubicon a thrasnú!", "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz", "XYZABCDEFGHIJKLMNOPQRSTUVWxyzabcdefghijklmnopqrstuvw")

An téacs ionchuir “Tá Caesar ag beartú an Rubicon a thrasnú!” torthaí i “Zxbpxo fp mixkkfkd ql zolpp qeb Oryfzlk!” Chun sampla tapa eile a thabhairt d’fhéidearthachtaí éagsúla, rinne mé feidhm mhiotail a ghlacann ionchur teaghrán agus a úsáideann feidhm aistrithe chun an téacs a chur ar ais, lena n-áirítear gach carachtar a thógann umlauts. Féach an fheidhm miotail Peann [forked] le Bryan Rasmussen.

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

Agus, má thugtar an téacs “Motley Crue rules, rock on dudes!”, filleann “Mötley Crüe rüles, röck ön düdes!” Ar ndóigh, d'fhéadfadh go mbeadh gach cineál scigaithris ag baint leis an bhfeidhm seo. Más tusa atá ann, ba chóir go gcuirfeadh an t-alt seo ar TVTropes neart inspioráide ar fáil duit. Ag baint úsáide as CSS Le XPath Cuimhnigh ar an bpríomhchúis atá againn le roghnóirí CSS a úsáid in éineacht le XPath: tuigeann CSS go mór cad is rang ann, ach is é an rud is fearr is féidir leat a dhéanamh le XPath ná comparáidí teaghrán ar aitreabúid an ranga. Oibreoidh sin i bhformhór na gcásanna. Ach má bhí tú riamh le dul i riocht, abair, inar chruthaigh duine éigin ranganna darb ainm .primaryLinks agus .primaryLinks2 agus go raibh XPath á úsáid agat chun an rang .primaryLinks a fháil, is dócha go dtiocfadh fadhbanna ort. Chomh fada is nach bhfuil aon rud amaideach mar sin, is dócha go n-úsáidfeá XPath. Ach tá brón orm a thuairisciú gur oibrigh mé in áiteanna ina ndéanann daoine na cineálacha rudaí amaideach sin. Seo taispeántas eile ag baint úsáide as CSS agus XPath le chéile. Léiríonn sé cad a tharlaíonn nuair a úsáidimid an cód chun XPath a rith ar nód comhthéacs nach nód an doiciméid é. Féach ar an Pen css agus xpath le chéile [forked] le Bryan Rasmussen. Is é an cheist CSS ná .alticles a, a fhaigheann an dá eilimint a i rannán a sanntar aicme earraí gaolmhara. Ina dhiaidh sin tá trí cheist “dona”, is é sin le rá, ceisteanna nach ndéanann an rud ba mhaith linn dóibh a dhéanamh agus na heilimintí seo á reáchtáil mar nód an chomhthéacs. Thig liom a mhíniú cén fáth a bhfuil siad ag iompar difriúil ná mar a bheifeá ag súil leis. Is iad na trí dhrochcheist atá i gceist ná:

//text(): Filleann sé an téacs ar fad sa doiciméad. //a/text(): Filleann sé an téacs ar fad taobh istigh de naisc sa doiciméad. ./a/text(): Níl aon torthaí ar ais.

Is é an chúis atá leis na torthaí seo ná cé gur gné a fuarthas ar ais ón gceist CSS do chomhthéacs, // téann sé in aghaidh an doiciméid ar fad. Is é seo an neart XPath; Ní féidir le CSS dul ó nód aníos go dtí sinsear agus ansin chuig deartháir nó deirfiúr leis an sinsear sin, agus siúl síos go dtí sliocht an siblín sin. Ach is féidir XPath. Idir an dá linn, cuireann ./ ceist ar pháistí an nód reatha, áit a seasann an ponc (.) don nód reatha, agus an seasann an tosaigh (/) ag dul go dtí nód linbh éigin — cé acu tréith, eilimint nó téacs é a chinneann an chéad chuid eile den chosán. Ach níl aon leanbh ina ghné roghnaithe ag an gceist CSS, mar sin ní thagann aon rud ar ais leis an gceist sin freisin. Tá trí cheist mhaith sa taispeántas deireanach sin:

.//téacs(), ./téacs(), normalú-spás(./text()).

Léiríonn an cheist normalú-spáis úsáid fheidhm XPath, ach réitíonn sé fadhb a chuimsítear sna ceisteanna eile freisin. Tá an HTML struchtúrtha mar seo:

Do Thástáil Gné a Uathoibriú Le Tiománaí Gréasáin Seiléiniam

Filleann an cheist fotha líne ag tús agus ag deireadh an nód téacs,agus normalú-spás baintear é seo. Ag baint úsáide as aon fheidhm XPath a thugann rud éigin ar ais seachas Boole le hionchur baineann XPath le feidhmeanna eile. Léiríonn an taispeántas seo a leanas roinnt samplaí: Féach ar na samplaí feidhmeanna Peann xpath [forked] le Bryan Rasmussen. Léiríonn an chéad sampla fadhb ar chóir duit a bheith ag faire amach di. Go sonrach, an cód seo a leanas:

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

…ar ais teaghrán amháin:

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

Déanann sé ciall, ceart? Ní thugann na feidhmeanna seo eagair ar ais ach teaghráin shingil nó uimhreacha singil. Ní fhaigheann ach an chéad toradh má ritheann tú an fheidhm áit ar bith le torthaí iolracha. Léiríonn an dara toradh cad atá uainn i ndáiríre:

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

A thugann ar ais sraith de dhá teaghrán:

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

Is féidir feidhmeanna XPath a neadú díreach cosúil le feidhmeanna i JavaScript. Mar sin, má tá struchtúr URL Smashing Magazine ar eolas againn, d’fhéadfaimis an méid seo a leanas a dhéanamh (moltar úsáid a bhaint as liteartha teimpléid): `aistrithe ( fotheaghrán ( substring-i ndiaidh(./@href, 'www.smashingmagazine.com/') ,9), '/','')`

Tá sé seo ag éirí beagán ró-chasta sa mhéid is go dteastaíonn tuairimí uaidh a chuireann síos ar a ndéanann sé: tóg an URL ar fad ón tréith href tar éis www.smashingmagazine.com/, bain an chéad naoi gcarachtar, ansin aistrigh an carachtar slais (/) ar aghaidh go dtí rud ar bith ionas go bhfaighidh tú réidh leis an deireadh tosaigh slais. An t-eagar mar thoradh air:

["gné-thástáil-seiléiniam-tiománaí gréasáin","uathoibrithe-tástála-torthaí-feabhsú-inrochtaineacht"]

Tuilleadh Cásanna Úsáide XPath Is féidir le XPath taitneamh a bhaint as i ndáiríre i dtástáil. Níl an chúis deacair a fheiceáil, mar is féidir XPath a úsáid chun gach eilimint sa DOM a fháil, ó aon áit sa DOM, ach ní féidir le CSS. Ní féidir leat brath ar ranganna CSS a bheith comhsheasmhach i go leor córas tógála nua-aimseartha, ach le XPath, táimid in ann meaitseanna níos láidre a dhéanamh maidir le cad é ábhar téacs eilimint, beag beann ar struchtúr DOM atá ag athrú. Tá taighde déanta ar theicnící a cheadaíonn duit tástálacha athléimneacha XPath a dhéanamh. Níl aon rud níos measa ná tástálacha a bheith scoite amach agus teipthe díreach toisc nach n-oibríonn roghnóir CSS a thuilleadh toisc go bhfuil rud éigin athainmnithe nó bainte. Tá XPath iontach freisin ag eastóscadh il-aimsitheoirí. Tá níos mó ná bealach amháin ann chun fiosrúcháin XPath a úsáid chun eilimint a mheaitseáil. Tá an rud céanna fíor le CSS. Ach is féidir le ceisteanna XPath druileáil isteach ar rudaí ar bhealach níos spriocdhírithe a chuireann srian ar an méid a fhaigheann tú ar ais, rud a ligeann duit meaitseáil ar leith a aimsiú ina bhféadfadh roinnt cluichí féideartha a bheith ann. Mar shampla, is féidir linn XPath a úsáid chun eilimint h2 ar leith a thabhairt ar ais atá taobh istigh de div a leanann div siblín díreach ina bhfuil eilimint íomhá linbh le tréith data-testID="leader" air:

ná faigh an ceannlíne seo

Ná faigh an ceannteideal seo ach an oiread

An ceanntásc don íomhá ceannaire

Seo an cheist: document.queryXPaths(` //div[ deartháir nó deirfiúr seo a leanas::div[1] /img[@data-testID='ceannaire'] ] /h2/ téacs() `);

Buailfimid isteach i dtaispeántas féachaint conas a thagann sé sin go léir le chéile: Féach ar an gCoimpléasc Peann Iarratas H2 [forked] le Bryan Rasmussen. Mar sin, tá. Tá go leor bealaí féideartha chuig eilimint ar bith i dtástáil ag baint úsáide as XPath. XSLT 1.0 Dímheas Luaigh mé go luath go bhfuil sé beartaithe ag foireann Chrome tacaíocht XSLT 1.0 a bhaint den bhrabhsálaí. Tá sé sin tábhachtach toisc go n-úsáideann XSLT 1.0 ríomhchlárú atá dírithe ar XML le haghaidh claochlú doiciméad a bhraitheann, ar a seal, ar XPath 1.0, agus sin an méid atá le fáil i bhformhór na mbrabhsálaithe. Nuair a tharlaíonn sé sin, caillfidh muid príomh-chomhpháirt XPath. Ach ós rud é go bhfuil XPath thar a bheith iontach chun tástálacha a scríobh, ní dóigh liom go n-imeoidh XPath ina iomláine am ar bith go luath. É sin ráite, thug mé faoi deara go gcuireann daoine spéis i ngné nuair a thógtar amach í. Agus is cinnte go bhfuil sé sin fíor i gcás XSLT 1.0 a bheith dímheasta. Tá plé iomlán ar siúl ag Hacker News líonta le hargóintí i gcoinne an dímheasa. Is sampla iontach é an post féin de chreat blagála a chruthú le XSLT. tuIs féidir leat an plé a léamh duit féin, ach cuireann sé isteach ar an gcaoi a bhféadfaí JavaScript a úsáid mar shim do XLST chun na cásanna sin a láimhseáil. Tá moltaí feicthe agam freisin gur chóir do bhrabhsálaithe SaxonJS a úsáid, atá mar chalafort chuig innill Saxon XSLT, XQUERY, agus XPath JavaScript. Is smaoineamh suimiúil é sin, go háirithe ós rud é go gcuireann Saxon-JS an leagan reatha de na sonraíochtaí seo i bhfeidhm, ach níl aon bhrabhsálaí ann a chuireann aon leagan de XPath nó XSLT i bhfeidhm níos faide ná 1.0, agus níl aon bhrabhsálaí a chuireann XQuery i bhfeidhm. Rinne mé teagmháil le Norm Tovey-Walsh ag Saxonica, an chuideachta taobh thiar de SaxonJS agus leaganacha eile den inneall Saxon. Dúirt sé: “Dá mbeadh suim ag aon díoltóir brabhsálaí SaxonJS a ghlacadh mar phointe tosaigh chun teicneolaíochtaí nua-aimseartha XML a chomhtháthú sa bhrabhsálaí, bheadh an-áthas orainn é a phlé leo.”— Norm Tovey-Walsh

Ach cuireadh leis freisin: “Bheadh an-iontas orm dá gceapfadh aon duine gurb é an cur chuige idéalach a bheadh i gceist le SaxonJS a thógáil mar atá sé faoi láthair agus é a ligean isteach i dtógáil an bhrabhsálaí gan athrú. D’fhéadfadh díoltóir brabhsálaí, toisc go dtógann siad an brabhsálaí, dul i ngleic leis an gcomhtháthú ag leibhéal i bhfad níos doimhne ná mar is féidir linn ‘ón taobh amuigh’.” - Norm Tovey-Walsh

Is fiú a thabhairt faoi deara gur tháinig tuairimí Tovey-Walsh thart ar sheachtain roimh fhógra dímheasa XSLT. Conclúid D’fhéadfainn dul ar aghaidh agus ar aghaidh. Ach tá súil agam gur léirigh sé seo cumhacht XPath agus go bhfuil neart samplaí tugtha duit ag léiriú conas é a úsáid chun rudaí iontacha a bhaint amach. Is sampla foirfe é de theicneolaíocht níos sine sa chruach brabhsálaí a bhfuil neart áirgiúlachta ann fós inniu, fiú mura raibh a fhios agat go raibh sé ann nó nár smaoinigh tú ar é a bhaint amach. Tuilleadh Léitheoireachta

“Feabhas a chur ar Athléimneacht na dTrialacha Gréasáin Uathoibrithe le Teanga Nádúrtha” (Leabharlann Dhigiteach ACM) le Maroun Ayli, Youssef Bakouny, Nader Jalloul, agus Rima Kilany Soláthraíonn an t-alt seo go leor samplaí XPath chun tástálacha athléimneacha a scríobh. XPath (MDN)Is áit iontach é seo le tosú más mian leat míniú teicniúil a shonraíonn conas a oibríonn XPath. XPath Teagaisc (ZVON)Tá an rang teagaisc seo an chuid is mó cabhrach i mo chuid foghlama féin, a bhuíochas sin do shaibhreas samplaí agus mínithe soiléire. XPather Ligeann an uirlis idirghníomhach seo duit oibriú go díreach leis an gcód.

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