JS-Selectors

by anoopsuda

HTML

<div id="demo"></div>
<p></p>
<p>querySelectorAll</p>
 <p>querySelectorAll</p>
<div class="demo"></div>

JavaScript

// getElementById()

// getElementsByTagName("li");
// getElementsByTagName("*");
// getElementsByTagName("p")[0]

//getElementsByClassName("example");

// querySelector()
// querySelectorAll()
document.getElementById("demo").innerHTML = "getElementById";

document.getElementsByTagName("p")[0].innerHTML = "getElementsByTagName";


document.getElementsByClassName("demo")[0].innerHTML = "getElementsByClassName";

const nodeList = document.querySelectorAll("p");
for (let i = 0; i < nodeList.length; i++) {
  nodeList[i].style.backgroundColor = "green";
}

document.querySelector("p").style.backgroundColor = "red";