So modifizieren Sie CSS nach Klassennamen in Selenium

Question

Ich lerne, wie man Selenium in verwendet python Und ich versuche a zu ändern css Stil auf http://www.google.com. Zum Beispiel die <span class="gbts"> ....</span> Auf dieser Seite. Ich möchte das ändern gbts Klasse.

browser.execute_script("q = document.getElementById('gbts');" + "q.style.border = '1px solid red';")

Gibt es eine API -Methode genannt getElementByClass('gbts') ?

Answer 1

Sie fragen, wie Sie mit JavaScript ein Element nach seiner CSS -Klasse erhalten. Nichts mit Selen zu tun Ja wirklich.

Unabhängig davon haben Sie einige Optionen. Sie können das Element zuerst mit Selenium greifen (also hier ist Selen relevant):

element = driver.find_element_by_class_name("gbts")

Mit einem Bezug auf dieses Element ist es dann sehr einfach, ihm einen Grenze zu geben:

driver.execute_script("arguments[0].style.border = '1px solid red';")

(Beachten Sie das arguments[0])

Wenn Sie JavaScript und JavaScript wirklich allein verwenden müssen, sind Sie sehr begrenzt. Das liegt daran, dass es keine gibt getElementByClassName Funktion innerhalb von JavaScript. Nur getElementsByClassName Das heißt, es würde eine zurückgeben aufführen von Elementen, die einer bestimmten Klasse entsprechen.

Sie müssen also speziell an das Element in der Liste gerichtet sind, das zurückgegeben wird. Sie möchten sich ändern. Wenn ich das ändern wollte ersten Element, das eine Klasse von hatte gbts, Ja, würde ich:

driver.execute_script("document.getElementsByClassName('gbts')[0].style.border = '1px solid red';")

Ich würde vorschlagen, dass Sie sich für die erste Option entscheiden, was bedeutet, dass Selen das Bein für Sie erledigt.

Answer 2

Eine weitere reine JavaScript -Option, die Sie möglicherweise finden, gibt Ihnen mehr Flexibilität, die Sie verwenden können document.querySelector().

Es wird nicht nur automatisch das erste Element aus den für Sie festgelegten Ergebnissen auswählen, sondern auch sagen, dass Sie mehrere Elemente mit diesem Klassennamen haben, sondern Sie wissen, dass es in einem bestimmten übergeordneten Element nur ein Element mit diesem Klassennamen gibt. Sie können einschränken Die Suche nach innerhalb dieses übergeordneten Elements zB, z. B. document.querySelector("#parent-div .gbts").

Siehe das (Mozilla -Dokumentation) Für mehr Information.