HTML5 Selectors API

HTML5 makes it easier to find HTML5 elements on the page or within your DOM structure. List of available calls and Descriptions with the examples are listed below.

First, you can get element by referencing its DOM id. This is done with the help of function called:

getElementById()

It returns the element by its ID. Example of this function call is

<divid="myId">

getElementById("myId");

Another function call is somewhat similar to first, but instead of ID it looks for DOM element by name. AS a result, it is called:

getElementsByName()

Returns elements of the page where name is specified as this function argument

<inputtype="text"name="myId">

getElementsByName("myId");

Finally, you can find and return element by its tag ame. getElementsByTagName()

Return all elements whose tag name matches the specified value

<inputtype="text">

getElementsByTagName("input"); There are other selectors worth mentioning. They are called QuerySelectors. There are two of them. First is called querySelector() and another querySelectorAll(). First query selector returns first element which is found based on the search criteria and second is used to return all instances of the items matching its search criteria.

Example: var x = document.querySelector(".myClass") //returns first instance of the item with style called .myClass applied against it.