Heim > Web-Frontend > Front-End-Fragen und Antworten > Was ist der Unterschied zwischen XPath-Positionierung und CSS-Positionierung?

Was ist der Unterschied zwischen XPath-Positionierung und CSS-Positionierung?

青灯夜游
Freigeben: 2023-01-03 09:24:29
Original
7384 Leute haben es durchsucht

Unterschiede: 1. Direkte untergeordnete Elemente werden in XPATH mit „/“ definiert, während sie in CSS mit „>“ definiert werden. Wenn sich ein Element innerhalb eines anderen Elements (untergeordnetes Element oder Enkelelement) befindet, wird es mit „//“ in XPATH und nur mit Leerzeichen in CSS definiert.

Was ist der Unterschied zwischen XPath-Positionierung und CSS-Positionierung?

Die Betriebsumgebung dieses Tutorials: Windows 7-System, CSS3-Version, Dell G3-Computer.

Gemeinsame Positionierungsmethoden von xpath

Was ist der Unterschied zwischen XPath-Positionierung und CSS-Positionierung?

Vergleich von xpath-Positionierung und CSS-Positionierung

Xpath-Positionierung und CSS-Positionierung werden in tatsächlichen Projekten häufiger verwendet. XPath ist die Syntax zum Suchen von Knoten in XML-Dokumenten. Mit anderen Worten: Sie können dieses Element über seinen Pfad finden. Xpath ist leistungsfähiger, während der CSS-Selektor eine bessere Leistung aufweist, schneller ausgeführt wird und eine einfachere Syntax aufweist. Vergleichen Sie die beiden Methoden:

Direkte untergeordnete Elemente

Direkte untergeordnete Elemente in XPATH werden mit „/“ definiert, während sie in CSS mit „>“ definiert werden.

XPATH://div/input
CSS: div>input
Nach dem Login kopieren

Nachkommende Elemente

Wenn sich ein Element innerhalb eines anderen Elements (Kind oder Enkel) befindet, wird es mit „//“ in XPATH und nur mit Leerzeichen in CSS definiert.

XPATH://div//input
CSS: div input
Nach dem Login kopieren

ID-Positionierung

Element-ID in XPATH wird definiert mit: „[@id=‘kw’]“, während sie in CSS verwendet wird: „#kw“.

XPATH://input[@id='kw']
CSS: input#kw
Nach dem Login kopieren

【Empfohlenes Tutorial: CSS-Video-Tutorial

KLASSE-Positionierung

Für das Klassenattribut ähnelt XPATH der ID, während CSS durch einen Punkt dargestellt wird.

XPATH://input[@class="s_ipt"]
CSS: input.s_ipt
Nach dem Login kopieren

Kleiner Bruder-Element: Folge-Geschwister-Stiefgeschwister

Dies ist nützlich für Formularelemente, d. h. das nächste benachbarte Element auf der Seite, das sich innerhalb desselben übergeordneten Knotens befindet.

XPATH://input[@class="s_ipt"]/following-sibling::a
CSS:input[class="s_ipt"]+a
Nach dem Login kopieren

Brother-Element: previous-sibling Das vorherige benachbarte Element auf der Seite, das sich im selben übergeordneten Knoten befindet.

XPATH://a[@name='tj_baike']/preceding-sibling::a
CSS:无法实现
Nach dem Login kopieren

Was ist der Unterschied zwischen XPath-Positionierung und CSS-Positionierung?Übergeordnetes Knotenelement

Das übergeordnete Element eines Knotens auf der Seite.

XPATH: //input/parent
CSS: 无法实现
Nach dem Login kopieren

Attributwert

Wir können Elemente basierend auf jedem Attributwert positionieren.

XPATH: //input[@name='username']
CSS: input[name='username']
Nach dem Login kopieren

Mehrere Attributwerte

Wir können Elemente sogar über mehrere Attribute positionieren.

XPATH: //input[@name='rsv_spt' and @value="1"]
CSS: input[name='login'][type='submit']
Nach dem Login kopieren

Erstes untergeordnetes Element

XPATH: //div[@id='u1']/a[1]
CSS: div#u1 a:first-child
Nach dem Login kopieren
Letztes untergeordnetes Element

XPATH: //div[@id='u1']/a[last()]
CSS: div#u1 a:last-child
Nach dem Login kopieren
Zweites untergeordnetes Element

XPATH: //div[@id='u1']/a[2]
CSS: div#u1 a:nth-child(2)
Nach dem Login kopieren
Fuzzy. match

selenium中允许使用^=,$=或*=进行部分字符串匹配。
Nach dem Login kopieren
^=match Präfix

XPATH: input[starts-with(@id,'user')]
CSS: input[id^='user']
Nach dem Login kopieren
$= Passendes Suffix

XPATH: input[ends-with(@id,'name')]
CSS: input[id$='name']
Nach dem Login kopieren
*=Matching enthält

XPATH: input[contains(@id,'sernam')]
CSS: input[id*=sernam]
Nach dem Login kopieren
Weitere Programmierkenntnisse finden Sie unter: Programmiervideo! !

Das obige ist der detaillierte Inhalt vonWas ist der Unterschied zwischen XPath-Positionierung und CSS-Positionierung?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage