1.创建属性
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>动态创建属性</title>
<style>
.democlass{color:blue;}
</style>
</head>
<body> <ul class="container">
<li class="child">Coffee</li>
<li class="child">Tea</li>
<li class="child">Coffee</li>
<li class="child">Tea</li>
</ul> <script>
/*第一种方法(此方法仅限于css样式)
var child = document.getElementsByTagName("li")[0];
child.style.color="red";
*/ /*第二种方法
document.getElementsByTagName("li")[0].setAttribute("class","democlass");
*/
//第三种方法
var newStyle=document.getElementsByTagName("li")[1];
var newAttr = document.createAttribute("class");
newAttr.nodeValue="democlass"; //使用value或nodeValue均可
newStyle.setAttributeNode(newAttr);
</script>
</body>
</html> getdd[i].className="selected"; //通过数组设置标签直接添加类名
2.获取属性
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>动态获取属性</title>
<style>
.democlass{
color:blue;
}
</style>
</head>
<body>
<p id="demo"></p>
<ul class="example">
<li class="child1">Coffee</li>
<li class="child2">Tea</li>
<li class="child3">Coffee</li>
<li class="child4">Tea</li>
</ul> <script>
/*第一种方式：返回指定属性名的属性值
var getAttr=document.getElementsByTagName("li")[0].getAttribute("class");
document.getElementById("demo").innerHTML=getAttr;
*/
//第二种方式:返回指定属性名的属性值，以Attr对象
var getAttr=document.getElementsByTagName("li")[0].getAttributeNode("class").value;
document.getElementById("demo").innerHTML=getAttr;
//二种结果都返回child1
</script>
</body>
</html>
3.删除属性(文字颜色)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>动态删除属性</title>
<style>
.democlass{
color:blue;
}
</style>
</head>
<body>
<p id="demo"></p>
<ul class="example">
<li class="child1">Coffee</li>
<li class="child2 democlass">Tea</li>
</ul> <script>
/*第一种方式：删除指定的文字颜色属性
document.getElementsByTagName("li")[1].removeAttribute("class"); */
//第二种方式：删除指定的文字颜色属性，并以 Attr Node 对象返回被删除的属性
var n=document.getElementsByTagName("li")[1];
var a=n.getAttributeNode("class");
n.removeAttributeNode(a);
/*
此方法与 removeAttributeNode() 方法的差异是：removeAttributeNode() 方法删除指定的 Attr 对象，而此方法删除具有指定名称的属性。结果是相同的。同时此方法不返回值，而 removeAttributeNode() 方法返回被删除的属性，以 Attr 对象的形式。
*/
</script>
</body>
</html>
如果仅仅只是添加类:document.getElementById("myDIV").classList.add("mystyle")