xxxxxxxxxx
The querySelectorAll() method returns all elements in the document
that matches a specified CSS selector(s), as a static NodeList object.
The NodeList object represents a collection of nodes.
The nodes can be accessed by index numbers.
The index starts at 0.
xxxxxxxxxx
//To obtain a NodeList of all of the <input> elements type password:
const passwords = document.querySelectorAll("input[type='password']");
xxxxxxxxxx
var container = document.querySelector("#test");
var matches = container.querySelectorAll("div.highlighted > p");
xxxxxxxxxx
//To obtain a NodeList of all of the <p> elements in the document:
const matches = document.querySelectorAll("p");
//This example returns a list of all <div> elements within the document with a class of either note or alert:
const matches = document.querySelectorAll("div.note, div.alert");
//Here, we get a list of <p> elements whose immediate parent element is a <div> with the class highlighted and which are located inside a container whose ID is test.
const container = document.querySelector("#test");
const matches = container.querySelectorAll("div.highlighted > p");
xxxxxxxxxx
// https://www.google.com/
// this puts a border around the 'a' tags of 'Google offered in' section.
// within this id find all the 'a' tags
var languages = document.querySelectorAll("#SIvCob a");
// loop through all the a tags a add a border to the tags
for(var i = 0; i < languages.length; i++){
document.querySelectorAll("#SIvCob a")[i].style.border = "1px solid black";
}
xxxxxxxxxx
// Obtain a NodeList of all of the <p> elements in the document
const matches = document.querySelectorAll("p");