DOM修改

㈠DOM标准

核心DOM：                                                                               HTML DOM：

可操作一切结构化文档的API                                    专门操作HTML文档的简化版DOM API

包括HTML和XML                                                      仅对常用的复杂的API进行了简化

万能！                                                                       不是万能！

繁琐！                                                                       简单！

 

开发：先用简单的，再用复杂的补充——以实现效果为目标

 

㈡修改属性

核心DOM：4个操作

⑴读取属性值：2种:（了解）

①先获得属性节点对象，再获得节点对象的值：

var attrNode = elem.attributes[下标/属性名];
var attrNode = elem.getAttributeNode(属性名)

attrNode.value——属性值

 

②直接获得属性值

var value = elem.getAttribute("属性名")；

 

⑵修改属性值

elem.setAttribute("属性名"，value)；

 

示例：

var h1 = document.getElementById("a1");
h1.setAttributeNode("name",zhangjie);

 

⑶判断是否包含指定属性：

var bool = elem.hasAttribute("属性名")

 

示例：

elem.hasAttribute("属性名")     //true或false 

document.getElementById('bt1').hasAttribute('onclick');

 

⑷移除属性

elem.removeAttribute("属性名")

 

案例：

<a id = "alink" class = "slink" href= "javascript:void(0)" onclick = "jump()">百度搜索</a>

var a = document.getElementById('alink');
a.removeAttribute('class');

 

㈢修改样式

⑴内联样式：elem.style.属性名

⑵强调：属性名：去横线，变驼峰

⑶比如：css:background-color => backgroundColor

                     list-style-type => listStyleType