Way to access the objects(selecting HTML elements)
Function [getElementsByTagName()] deep understanding
If elements are in the form of an array we have to select one of those elements. This can be done by [document.getElementsbyTagName].
This getElementsByTagName() helps in returning a collection of all the HTML elements declared in the specified tag name.
This getElementsByTagName() is a read-only property that helps to target the desired elements from your (index.html) file.
Using the getElementsByTagName() property we get output in the form of an array.
Note-
If you see the word {Elements} it is in a plural form which means it will select a group of elements specified with the same tag name.
So in order to get a specific element to be the target we have to be specific with the index of the array.
Example-
Statement should be written in such a way as-
document.getElementsbyTagName("li")[2].style.color = "red";
Here we can see that we have specified (list item) and [array index] in the respected place in order to target the particular element in HTML.
In order to make it easy for all the developers out there I am sharing the link to a Chrome extension that will help you visualize the structure of your web page.
This will further make it easy for you to target elements as it will provide elements with there tag names.
Conclusion-
Understanding how the function [getElementsByTagName()] deep understanding.