Question

Q: Provide the expression to create an object collection of all objects referenced by the CSS selector div#intro p?

Answer 1

Selector div#intro p means

Div is tag used an d html

#intro is the id used in the html code

p is again the paragraph tag of html

Now we want all the objects referenced by this selector id  using HTML DOM

So we use querySelectorAll() method   returns a collection of an element's child elements that matches a specified CSS selector i,e id or class , in form of a static single object

Steps

1. Give your div tag a id let's say divid

2. Define many element inside div inside p tag with id as intro as specified by you like

<div id="divid">

<p id ="intro "> My first id reference using intro <p>

<p id ="intro "> My Second id reference using intro <p>

</div>

and so on as many as you want

3. Now we to access all in form of a object collectively so use querySelectorAll() along with getElementById()

like this

var x = document.getElementById("divid").querySelectorAll("p#intro");

X contains all the objects that are referenced by id as intro inside div and p tag and you can access them like you access elements of any static object in HTML so X[0] will be represent first id reference and X[1] Second id reference and so on

Now using that you can do whatever you like to do

like for example

x[0].style.fontSize = "20px";

X[1].style.color="red";

So above changes will be applied only to specified Id and object reference and you can have a collection of all objects in one object only .

Thank You Please Upvote if you like it