JS Attribute属性操作详解
attribute是属性的意思，文章仅对部分兼容ie和ff的attribute相关的介绍。
attributes：获取一个属性作为对象
getattribute：获取某一个属性的值
setattribute：建立一个属性，并同时给属性捆绑一个值
createattribute：仅建立一个属性
removeattribute：删除一个属性
getattributenode：获取一个节点作为对象
setattributenode：建立一个节点
removeattributenode：删除一个节点
attributes可以获取一个对象中的一个属性，并且作为对象来调用，注意在这里要使用“[]”，ie在这里可以使用“()”，考虑到兼容性的问题，要使用“[]”。关于attributes属性的使用方式上，ie和ff有巨大的分歧，在此不多介绍。
attributes的使用方法：（ie和ff通用）
<body>
<div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
</body>
<script>
var d = document.getelementbyid("sss").attributes["value"];
document.write(d.name);
document.write(d.value);
//显示value aaa
</script>
getattribute，setattribute，createattribute，removeattribute四兄弟的概念比较容易理解，使用方法也比较简单，唯一需要注意这几点：
1、createattribute在使用的时候不需要基于对象的，document.createattribute()就可以。
2、setattribute，createattribute在使用的时候不要使用name，type，value等单词，ie和ff的反应都奇怪的难以理解。
3、createattribute在使用的时候如果只定义了名字，没有d.nodevalue = "hello";语句定义值，ff会认为是一个空字符串，ie认为是undefined，注意到这点就可以了。
getattribute的使用方法：
<body>
<div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
</body>
<script>
var d = document.getelementbyid("sss").getattribute("value");
document.write(d);
//显示 aaa
</script>
setattribute的使用方法：（你会发现多了一个名为good的属性hello）
<body>
<div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
</body>
<script>
var d = document.getelementbyid("sss").setattribute("good","hello");
alert(document.getelementbyid("t").innerhtml)
</script>
createattribute的使用方法：（多了一个名为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 );/*同上*/
attr.nodevalue = 'world';/*对自定义属性进行编辑*/
alert( document.body.innerhtml );/*同上*/
obox.setattributenode(attr);/*对标签插入自定义属性*/
alert( document.body.innerhtml );/*改变*/
};
</script>
</head>
<body>
<ul id="box">
</ul>
</body>
removeattribute的使用方法：（少了一个）
<body>
<div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
</body>
<script>
var d = document.getelementbyid("sss").removeattribute("value");
alert(document.getelementbyid("t").innerhtml)
</script>
getattributenode，setattributenode，removeattributenode三个方法的特点是都直接操作一个node（节点），removeattributenode在一开始的时候总会用错，但是充分理解了node的含义的时候，就能够应用自如了。
getattributenode的使用方法：
<body>
<div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
</body>
<script>
var d = document.getelementbyid("sss").getattributenode("value");
document.write(d.name);
document.write(d.value);
//显示 value aaa
</script>
setattributenode的使用方法：
<body>
<div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
</body>
<script>
var d = document.createattribute("good");
document.getelementbyid("sss").setattributenode(d);
alert(document.getelementbyid("t").innerhtml);
</script>
removeattributenode的使用方法：
<body>
<div id = "t"><input type = "hidden" id = "sss" value = "aaa"></div>
</body>
<script>
var d = document.getelementbyid("sss").getattributenode("value")
document.getelementbyid("sss").removeattributenode(d);
alert(document.getelementbyid("t").innerhtml);
</script>
以上这篇js attribute属性操作详解就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持。
上一篇： SKETCHUP展示建筑生长动画的技巧
下一篇： 人参和玛咖，关于他们的这些事你最好知道