JavaScript methods to get elements directly through element ID and name

Source: Internet
Author: User
Tags html page

This article mainly describes the JavaScript through the element ID and name directly to get elements of the method, involving JavaScript to get elements of the relevant skills, very practical value, the need for friends can refer to the

The examples in this article describe the way JavaScript directly obtains elements through element IDs and name. Share to everyone for your reference. The specific analysis is as follows:

We know some of the third party JS Library on how to quickly select the elements in HTML to do some simplification, seemingly very inscrutable, in fact, otherwise. And JS itself with a special element of the simple selection of methods, the following for everyone a brief introduction.

In HTML, the most straightforward way to identify HTML elements is to use the name and ID attributes, which are subtly different: IDs must be unique to the page, but name can have duplicates.

In JS, if the ID name does not have the same name as a built-in property or global variable, it automatically becomes the property of the Window object, and in the top-level environment of an HTML page:


1 this = = window

So if we write an HTML element code like this, we can refer to it as follows:


1 2 3 4 5 <input type= "button" id= "Btn_ok" value= "OK" onclick= "..."/>//Can be so referenced btn_ok.onclick = function () {}; Or the following is the same = ...;

For the Name property, only certain types of HTML elements have similar methods, such as Form,img,iframe,applet,embed,object. In these elements, the elements of a particular Name property can be accessed through the properties of the global variable or document, and if there are multiple elements of the same name property, a NodeList object resembling a read-only group, such as the following code, is returned:


1 2 3 4 5 6 7 8 9 10 11 <div> </div>//We can quote the elements named Pic: for (x in pic) console.log (Pic[x].alt); or non-"standard" syntax each statement way for each (img in pic) console.log (Img.alt);

I hope this article will help you with your JavaScript programming.

Related Article

E-Commerce Solutions

Leverage the same tools powering the Alibaba Ecosystem

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: and provide relevant evidence. A staff member will contact you within 5 working days.