08-16 3571人
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div id="dv">
<ul id="uu">
<li>第一个</li>
<li>第二个</li>嘎嘎
<li id="three">第三个</li>哈哈
<li>第四个</li>
<li>第五个</li>
</ul>
</div>
<script src="common.js"></script>
<script>
//ul的父级节点
console.log(my$("uu").parentNode);
//ul的父级元素
console.log(my$("uu").parentElement);
//ul的所有子级节点
console.log(my$("uu").childNodes);
//ul的所有的子元素
console.log(my$("uu").children);
//ul中第一个子节点
console.log(my$("uu").firstChild);
//ul中第一个子元素
console.log(my$("uu").firstElementChild);
//ul中最后一个子节点
console.log(my$("uu").lastChild);
//ul中最后一个子元素
console.log(my$("uu").lastElementChild);
//某个li的前一个兄弟节点
console.log(my$("three").previousSibling);
//某个li的前一个兄弟元素
console.log(my$("three").previousElementSibling);
//某个li的后一个兄弟节点
console.log(my$("three").nextSibling);
//某个li的后一个兄弟元素
console.log(my$("three").nextElementSibling);
//总结:获取节点的代码,谷歌是获取节点,获取元素的代码,谷歌是获取元素
//但是,到了IE8中,获取节点的代码是获取元素,获取元素的代码,不支持
</script>
</body>
</html>
欢迎留言