Elementy html o podanym id możemy wyszukiwać za pomocą js na wiele sposobów. Jednym z najprostszych jest skorzystanie po prostu z nazwy id, innym jest użycie metody document.getElementById(„id”), a jeszcze innym jest użycie metody document.querySelector(„#id”).
Poniżej przykłady przypisania elementu o id 'main’ do stalej na 3 różne sposoby.
const mainDiv = main;
//const mainDiv = document.getElementById("main");
//const mainDiv = document.querySelector("#main");
mainDiv.textContent = "Changed with js";
Pamiętaj, by pobierać elementy html po załadowaniu DOM, w przciwnym razie dostaniemy informację o błędzie.
Aby mieć pewność, że wszystko zadziała prawidłowo, powinniśmy wykonać powyższy kod na samym dole strony www.
Innym rozwiązaniem jest owinięcie kodu wewnątrz funkcji i dodanie EventListenera, który wykona się po załadowaniu strony, np:
function init(){
const mainDiv = main;
//const mainDiv = document.getElementById("main");
//const mainDiv = document.querySelector("#main");
mainDiv.textContent = "Changed with js";
}
document.addEventListener("DOMContentLoaded",init);