<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="dv">
<span>这是div中的第一个span标签</span>
<p>这是div中的第二个元素,第一个p标签</p>
<ul id="uu">
<li>乔峰</li>
<li>鹿茸</li>
<li id="three">段誉</li>
<li>卡卡西</li>
<li>雏田</li>
</ul>
</div>
<script src="common.js"></script>
<script>
var ulObj = my$("uu");
//ul标签的父级节点
console.log(ulObj.parentNode);
//ul标签的父级元素
console.log(ulObj.parentElement);
var divOBJ = my$("dv");
//div的子节点
console.log(divOBJ.childNodes);
//div的子元素
console.log(divOBJ.children);
//div
var dvObj = document.getElementById("dv");
//获取里面的每个子节点
for (var i = 0; i < dvObj.childNodes.length; i++) {
var node = dvObj.childNodes[i];
//nodeType:--->节点类型:1---标签,2---属性,3---文本
//nodeName:--->节点名字:大写的标签名----标签,小写的属性名---属性,#text---文本
//nodeValue:--->节点值:标签---null,属性---属性的值,文本---文本内容
console.log(node.nodeType + "======" + node.nodeName + "======" + node.nodeValue)
}
//div
var dv1Obj = document.getElementById("dv");
//获取的是属性的节点
var node1 = dv1Obj.getAttributeNode("id");
console.log(node1.nodeType + "======" + node1.nodeName + "======" + node1.nodeValue);
</script>
</body>
</html>
原文地址：https://www.cnblogs.com/cuilichao/p/9374631.html
时间： 2024-10-08 16:29:18