Latest web development tutorials

HTML DOM access

Access to HTML DOM - find HTML elements.

Access HTML elements (nodes)

Access HTML elements equivalent to Access Node

You can be in a different way to access HTML elements:

  • By using the getElementById () method
  • By using the getElementsByTagName () method
  • By using getElementsByClassName () method

getElementById () method

getElementById () method returns the element with the specified ID:

grammar

node.getElementById("id");

The following example Get id = "intro" element:

Examples

document.getElementById("intro");

try it"

getElementsByTagName () method

getElementsByTagName () returns all elements with the specified tag name.

grammar

node.getElementsByTagName("tagname");

The following example returns a list of documents that contain all the <p> element:

Example 1

document.getElementsByTagName("p");

try it"

The following example returns a list of documents that contain all the <p> element, and the <p> element should be a descendant id = "main" element (child, Sun, etc.):

Example 2

document.getElementById("main").getElementsByTagName("p");

try it"

The getElementsByClassName () Method

If you want to find all HTML elements with the same class name, use this method:

document.getElementsByClassName("intro");

Returns a list containing the above example class = "intro" all the elements:

Note: getElementsByClassName () is not valid in 5,6,7,8 in Internet Explorer.