DOM

Question 1

Can I make a loop with a collection?

Answer 1

Yes, you have to use the forEach loop

// let scripts = document.scripts;

// let scriptsArr = Array.from(scripts)

// scriptsArr.forEach(function(script) {
//   console.log(script.getAttribute('src'));
// });

// console.log(val);

Question 2

How can you select a specific ‘li’ of an item in order to modify its content, style? Keep in mind that you have to select it!

Answer 2

document. querySelector(‘li:last-child’).style.color = ‘red’; (this is for the last item)
document. querySelector(‘li:nth-child(3)’).textContent = ‘Hello world’; (here I select the third user and change the content.
document. querySelector(‘li:nth-child(odd)’).style.background = ‘#ccc’; (Here I change the background seems like, he hasn’t properply explain how odd works)
document. querySelector(‘li:nth-child(even)’).style.background = ‘#ccc’; (Here even does the same as odd, but they have different porpouse, they haven’t explained it yet)

Question 2

How does query selector looks like in both ways?

Answer 2

console. log(document.querySelector(‘#task-title’));

document. querySelector(‘li’).style.color = ‘red’;

Question 3

How can you select several classes that have the same name? and can you modify it ? if so how?

Answer 3

const items = document.getElementsByClassName(‘collection-item’);

you can also modify it by doing working on it as a CSS

console.log(items);
console.log(items[0]);
items[0].style.color = ‘red’;
items[3].textContent = ‘Hello’

Question 4

How does this work? Explain

const listItems = document.querySelector(‘ul’).getElementsByClassName(‘collection-item’);

console.log(listItems);

What is the difference between the above and this?

const items = document.getElementsByClassName(‘collection-item’);

console.log(items);

Answer 4

We first declared our variable and assign it the value to select our ‘‘ul’’ after the ‘‘ul’’ was selected we order it to look for the elements with a class of ‘‘collection item’’ afterward we console that log it.

The difference it’s that the one below will select all the items that have a class of ‘‘collection-item’’ however the first one does not since queryselect specify that it should look for the class within the ‘‘ul’’