JavaScript methods to get elements directly through element ID and name _javascript tips

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:

this = = window

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

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

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:

<div>
   
  < IMG name= "pic" src= "#" alt= "pic_2"/>
</div>/
/We can do this by referencing the element 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.