Attribute means attributes, and the article only introduces some Attributes that are compatible with IE and FF.
attributes: Get an attribute as an object
getAttribute: Get the value of a certain attribute
setAttribute: Create an attribute and bundle a value for the attribute at the same time
createAttribute: Create only one attribute
removeAttribute: Remove an attribute
getAttributeNode: Get a node as an object
setAttributeNode: Create a node
removeAttributeNode: Remove a node
Attributes can obtain an attribute in an object and call it as an object. Note that you should use "[]" here, and IE can use "()" here. Considering the compatibility issue, you should use "[]". There are huge differences between IE and FF on how to use attributes attributes, so I will not introduce it here.
How to use attributes: (common for IE and FF)
<body><div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div></body><script>var d = document.getElementById("ss").attributes["value"];document.write(d.name);document.write(d.value);//Show value aaa</script>The concepts of the four brothers getAttribute, setAttribute, createAttribute, and removeAttribute are easier to understand, and the usage method is relatively simple. The only things to pay attention to:
1. When using createAttribute, you do not need to be object-based. document.createAttribute() is enough.
2. When using setAttribute, createAttribute, do not use words such as name, type, value, etc., the reactions of IE and FF are strangely difficult to understand.
3. If createAttribute only defines the name and does not define the value of the d.nodeValue = "hello"; statement, FF will be considered an empty string, and IE will be considered undefined, just notice this.
How to use getAttribute:
<body><div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div></body><script>var d = document.getElementById("ss").getAttribute("value");document.write(d);//Show aaa</script>How to use setAttribute: (You will find an additional attribute called good hello)
<body><div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div></body><script>var d = document.getElementById("ss").setAttribute("good","hello");alert(document.getElementById("t").innerHTML)</script>How to use createAttribute: (Add an empty attribute called good)
<head> <meta charset="UTF-8"> <title></title> <script> window.onload = function (){ var oBox = document.getElementById('box'); alert( document.body.innerHTML); oBox.setAttribute('value','name'); alert( document.body.innerHTML); attr = document.createAttribute('hallo'); alert( document.body.innerHTML);/*Synonymous*/ attr.nodeValue = 'world';/*Edit custom attributes*/ alert( document.body.innerHTML );/*Same as above*/ oBox.setAttributeNode(attr);/*Insert custom attributes to tags*/ alert( document.body.innerHTML );/*Change*/ }; </script> </head> <body> <ul id="box"> </ul> </body>How to use removeAttribute: (One is missing)
<body><div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div></body><script>var d = document.getElementById("ss").removeAttribute("value");alert(document.getElementById("t").innerHTML)</script>The three methods getAttributeNode, setAttributeNode, and removeAttributeNode are characterized by directly operating a node (node). RemoveAttributeNode will always be used incorrectly at the beginning, but when you fully understand the meaning of node, you can apply it freely.
How to use getAttributeNode:
<body><div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div></body><script>var d = document.getElementById("ss").getAttributeNode("value"); document.write(d.name);document.write(d.value);//Show value aaa</script>How to use setAttributeNode:
<body><div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div></body><script>var d = document.createAttribute("good");document.getElementById("ss").setAttributeNode(d);alert(document.getElementById("t").innerHTML);</script>How to use removeAttributeNode:
<body><div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div></body><script>var d = document.getElementById("ss").getAttributeNode("value")document.getElementById("sss").removeAttributeNode(d); alert(document.getElementById("t").innerHTML);</script> For more questions about attributes, you can check it in w3school!The above detailed explanation of JS Attribute attribute operation is all the content I share with you. I hope you can give you a reference and I hope you can support Wulin.com more.