Come modificare CSS per nome di classe in selenio

Question

Sto imparando a usare il selenio in python E provo a modificare un file css stile su http://www.google.com. Ad esempio, il <span class="gbts"> ....</span> In quella pagina. Vorrei modificare il gbts classe.

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

C'è un metodo API chiamato getElementByClass('gbts') ?

Answer 1

Stai chiedendo come ottenere un elemento entro la sua classe CSS usando JavaScript. Niente a che fare con il selenio veramente.

Indipendentemente da ciò, hai alcune opzioni. Puoi prima prendere l'elemento usando il selenio (quindi qui, sì, il selenio è rilevante):

element = driver.find_element_by_class_name("gbts")

Con un riferimento a questo elemento già, è quindi molto facile dargli un confine:

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

(Notare la arguments[0])

Se devi davvero usare JavaScript e JavaScript da solo, allora sei molto limitato. Questo perché non c'è no getElementByClassName funzione all'interno di JavaScript. Solo getElementsByClassName il che significa che restituirebbe a elenco di elementi che corrispondono a una determinata classe.

Quindi è necessario colpire specificamente quale elemento all'interno dell'elenco, che viene restituito, si desidera cambiare. Se volessi cambiare il il primissimo elemento che aveva una classe di gbts, Farei:

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

Ti suggerirei di andare per la prima opzione, il che significa che hai il selenio fare il lavoro delle gambe per te.

Answer 2

Un'altra opzione JavaScript pura che potresti trovare offre una maggiore flessibilità è usare document.querySelector().

Non solo selezionerà automaticamente il primo elemento dal set di risultati per te, ma anche di avere più elementi con quel nome di classe, ma sai che esiste un solo elemento con quel nome di classe all'interno di un determinato elemento genitore, puoi limitare la ricerca all'interno di quell'elemento genitore, ad es. document.querySelector("#parent-div .gbts").

Vedere il (Documentazione Mozilla) per maggiori informazioni.