JavaScript/Finding Elements
Previous: Runtime document manipulation Index Next: Adding elements

The most common method of detecting page elements in the DOM is by the document.getElementById(id) method.

Simple Use

Let's say, on a page, we have:

<div id="myDiv">content</div>

A simple way of finding this element in JavaScript would be:

var myDiv = document.getElementById("myDiv"); // Would find the DIV element by its ID, which in this case is 'myDiv'.

Use of getElementsByTagName

Another way to find elements on a web page is by the getElementsByTagName(name) method. It returns an array of all name elements in the node.

Let's say, on a page, we have:

<div id="myDiv">
  <p>Paragraph 1</p>
  <p>Paragraph 2</p>
  <h1>An HTML header</h1>
  <p>Paragraph 3</p>

Using the getElementsByTagName method we can get an array of all <p> elements inside the div:

var myDiv = document.getElementById("myDiv"); // get the div
var myParagraphs = myDiv.getElementsByTagName('P'); //get all paragraphs inside the div

// for example you can get the second paragraph (array indexing starts from 0)
var mySecondPar = myParagraphs[1]

Previous: Runtime document manipulation Index Next: Adding elements

  This article uses material from the Wikipedia page available here. It is released under the Creative Commons Attribution-Share-Alike License 3.0.


Manage research, learning and skills at IT1me. Create an account using LinkedIn to manage and organize your IT knowledge. IT1me works like a shopping cart for information -- helping you to save, discuss and share.

  Contact Us  |  About |  IT Training & References |  IT Careers |  IT Hardware |  IT Software |  IT Books