The following html is used as an example.
Copy codeThe Code is as follows: <div id = "myDiv" class = "bd" title = "I am div">
<A id = "myA" href = "http://www.baidu.com"> Baidu </a>
</Div>
1. Obtain and set the element features through the attributes of the HTMLElement type (object)Copy codeThe Code is as follows: var div = document. getElementById ("myDiv ");
Var img = document. getElementById ("img1 ");
Var a = document. getElementById ("myA ");
// Obtain element features
Alert (div. id); // "myDiv"
Alert (div. className); // "bd", this is not div. class, because class is reserved keyword
Alert (div. title); // "I am div"
Alert (a. href); // http://www.baidu.com
// Set element features
Div. id = "myDiv2"; // change the id to "myDiv2"
Div. className = "ft"; // change the class to "ft". If there is a style named "ft", it will immediately become "ft" and the browser will immediately respond.
Div. title = "myDiv2"; // change the title to "myDiv2"
Div. align = "center"; // set center alignment
Img. src = "images/img1.gif"; // sets the image path.
A. innerHTML = "Sina"; // change "Baidu" to "Sina"
A. href = "http://www.sina.com.cn"; // reset the hyperlink
2. the getAttribute (), setAttribute (), and removeAttribute () methods are used to obtain, set, and remove the features of an element (not recommended. IE6 and 7 of the first two methods have an exception, the third method is not supported by IE6 and can be used to set custom features)
The getAttribute () method is used to obtain element features. Take a parameter to obtain the feature name of the element.
SetAttribute () method, used to set element features. Two parameters are used to obtain the feature name and feature value of an element.
The removeAttribute () method is used to remove the features of an element. Accept a parameter, that is, the feature name of the element to be removed.Copy codeThe Code is as follows: var div = document. getElementById ("myDiv ");
Var img = document. getElementById ("img1 ");
Var a = document. getElementById ("myA ");
// Obtain element features
Alert (div. getAttribute ("id"); // "myDiv"
Alert (div. getAttribute ("class"); // "bd", note that this is a class, not a className, which is different from the above
Alert (div. getAttribute ("title"); // "I am div"
Alert (a. getAttribute ("href"); // http://www.baidu.com
// Set element features
Div. setAttribute ("id", "myDiv2"); // change the id to "myDiv2"
Div. setAttribute ("class", "ft"); // change the class to "ft", which is also a class instead of className.
Div. setAttribute ("title", "myDiv2"); // change the title to "myDiv2"
Div. setAttribute ("align", "center"); // set center alignment
Img. setAttribute ("src", "images/img1.gif"); // you can specify the image path.
// Remove element features
Div. removeAttribute ("class"); // remove the class Feature
3. Get, set, and remove element features through attributesCopy codeThe Code is as follows: var div = document. getElementById ("myDiv ");
// Obtain element features
Alert (div. attributes ["id"]. nodeValue); // "myDiv"
// Set element features
Div. attributes ["id"]. nodeValue = "myDiv2"; // change the id to "myDiv2"
// Remove element features
Div. attributes. removeNamedItem ("class"); // remove the class Feature