Wie kann man ein Element mit einem CSS- oder XPath-Selektor bestimmen?

Um Element mit CSS-Selektoren zu bestimmen, werden verschiedene Methoden verwendet, die auf der Struktur und den Attributen des HTML basieren:

• Nach Tag: div, input, button usw.
• Nach Klasse: .Klassenname (z.B. .btn-primary)
• Nach ID: #ElementID
• Nach Attributen: [type='text'], [name='benutzername']
• Kombinationen: div.klassenname, ul > li:first-child

Beispiel CSS-Selektor:

input[type='submit'].btn

XPath ermöglicht es, Elemente flexibler und präziser zu finden, indem es den Pfad im DOM und Bedingungen nutzt:

• Nach Tag: //div
• Nach Attribut: //input[@type='text']
• Nach Text: //button[text()='Absenden']
• Nach Index: (//li)[3] — drittes li-Element
• Relativ zu anderen Elementen: //div[@id='main']//a[@class='link']

Beispiel XPath:

//input[@name='benutzername' and @type='text']

Die Wahl zwischen CSS und XPath hängt von der Aufgabe und der Seitenstruktur ab. CSS ist einfacher und schneller, XPath ist mächtiger für komplexe Bedingungen.