借点操作

来源：互联网发布：mssql分布式编辑：程序博客网时间：2024/05/22 08:25

2.获取Node的方式
1 通过获取元素的方式获取Node
1.document.getElementById("elementID")
2.document.getElementBytagName("tagname")
3.document.getElementByname("name")
4.document.getElementByclassName("className")

2 通过Node关系属性获得引用
1 object.parentNode; //获取该元素的父节点
2 object.childNode; //获取对象所有的子节点,只包含次级节点
3 object.firstChild; //获取该元素第一个子节点
4 object.lastChild; //获取该元素最后一个节点
5 object.nextSibling; //获取该下一个兄弟节点
6 object.previousSibling;//获取该元素上一个兄弟节点
例如
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script>
window.onload=function() {
var li=document.getElementsByTagName("li");
console.log(li);//返回一个数组

console.log(li.length); 返回一个数组长度

console.log(li[0]) 获取LI的第一个元素的借点对象
var body=document.getElementsByTagName("body")[0];
console.log(body);

var all=document.getElementsByTagName("*");
console.log(all.length);
var ccc=document.getElementsByName("test")[0];
console.log(ccc.value);
alert(ccc.checked);
var a1 = document.getElementById("a1");
alert(a1.className);//获取DIV的CLASSNAME

alert(a1.getAttribute("className"));//firfox gogole 不能获取
alert(a1.getAttribute("class")); //IE 不能获取

if (box.getAttribute("class") == null) {
alert(a1.getAttribute("className"));
}
else {
alert(a1.getAttribute("class"))
}

};
</script>
</head>
<body>

<div id="a1" class="div1" style="color: blue" bbb="ggg"></div>

</body>
</html>

2.3 Node属性
nodeType(节点类型)
nodeName( 节点名)
nodeValue(节点值)

tips:其中元素节点值为1,属性节点值为2,文本节点值为3,注释节点值为8,文档节点值为9

3.NODE的增丶删丶查丶改
3.1创建NODE
1.创建元素节点
document.creatElement(TagName);

2.创建属性节点
document.createAttnbute(attr);
object.attr=var;
object.setAttribute(attr.var);

3.创建文本节点
object.lnnerText = var;
document.createTextNode(text);

3.2添加NODE
1.parentNode.appendChild(newNode);
说明：向节点的子节点列表的末尾添加新的子节点。如果文档树中已经存在了newNode,它将从文档中删除，然后重新插入新的位置。
可以使用appendChild()方法移除元素到另外一个元素。

2.parentNode.insertBefore(newNode.existingNOde);
说明：如果文档树中已经存在了newNode,它将从文档中删除，然后重新插入新的位置。

3.parentNode.replaceChild(newNode,oldNode)
说明：如果文档树中已经存在了newNode,它将从文档中删除，然后重新插入新的位置。

4.parentNode.removeChild(node);
说明：从子节点列表中删除某个节点

0 0