querySelector-metodi
querySelector-metodi mahdollistaa
sivun elementin hakemisen mielivaltaisen CSS-selektorin
avulla. Saatua elementtiä voidaan sitten manipuloida
erilaisilla tavoilla: muuttaa sen tekstiä,
attribuutteja, CSS-tyylejä ja niin edelleen.
Syntaksi
document.querySelector(selektor);
Esimerkki
Haetaan kappale #elem ja muutetaan
sen tekstiä textContent-ominaisuudella:
<p id="elem">teksti</p>
let elem = document.querySelector('#elem');
elem.textContent = '!!!';
Koodin suorituksen tulos:
<p id="elem">!!!</p>
Esimerkki
Haetaan kappale luokalla elem
ja muutetaan sen tekstiä:
<p class="elem">teksti</p>
let elem = document.querySelector('.elem');
elem.textContent = '!!!';
Koodin suorituksen tulos:
<p id="elem">!!!</p>
Katso myös
-
getElementById-metodi,
joka hakee elementinid:n perusteella -
querySelectorAll-metodi,
joka hakee elementtiryhmän selektorin perusteella
