First, the tag node is obtained by the ID attribute value of the tag.
Accepts a parameter: Returns the Htmldivelement object of the element if the corresponding element is found, or null if it does not exist.
<script type= "Text/javascript" > function() { var box = document.getElementById (' box '); // gets the element node with the ID of box alert (box.id); } </script>
The result is: Htmldivelement (the Node object representing the Div)
The ID represents the uniqueness of an element node and cannot create the same named ID for two or more element nodes at the same time.
Some low-version browsers will not recognize the getElementById () method is recommended case sensitivity to avoid incompatibility, such as ie5.0-, then need to make some judgments, can be combined with browser detection to operate.
<script type= "Text/javascript" > function () { if( document.getElementById) { // determine if getElementById var box is supported document.getElementById (' box '); alert (box.id); } Else { alert ("Browser is incompatible, please replace") } }; </script>
Ii. operation of element node properties
When we get to a particular element node through getElementById (), the node object is acquired by us, and through this node object, we can access a series of its properties.
<script type= "Text/javascript" >window.onload=function () { if(document.getElementById) {//determine if getElementById is supported varbox = document.getElementById (' box '); alert (box.tagname); //DIVAlert (box.innerhtml)//Test Div Gets the text content of the current element node (including HTML tags)Alert (box.innerhtml = ' play <strong>js</strong> ');//set the text content of the current node, you can use HTML tags, you can also parse}Else{alert ("Browser not compatible, please replace") } };</script>Third, the operation of HTML attributes
<script type= "Text/javascript" >window.onload=function () { if(document.getElementById) {//determine if getElementById is supported varbox = document.getElementById (' box '); alert (box.id); //gets the value of the id attributeAlert (box.id= ' person ');//set the value of the ID propertyalert (box.title);//gets the value of the titleAlert (box.title= ' title ... ');//set the value of the titlealert (Box.style);//Gets the Css2properties object (that is, the Style Property object)alert (Box.style.color);//gets the value of a color in a style objectAlert (box.style.color= ' Blue ');//set the value of a color in a style objectalert (box.classname);//Get classAlert (box.classname= ' Barbox ');//Set Classalert (BOX.BBB);//gets the value of the custom attribute, which is not supported by IE (if a browser is not supported, then a compatible operation must be done or not used as far as possible) }Else{alert ("Browser not compatible, please replace") } };</script>JavaScript Dom_ Gets the element method _getelementbyid () Gets the node of the specific ID element