<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>dom查询</title>
<script type="text/javascript">
window.onload = function(){
/*
获取父节点
parentNode
*/
var box2 = document.getElementById("box2");
var far = box2.parentNode;
// console.log(far.id);//box1
/*
innerText
- 该属性可以获取到元素内部的文本内容
- 它和innerHTML类似,不同的是它会自动将html去除
*/
// console.log(far.innerHTML);
/*
<div id="box2">
<li id="li1">1</li>
<li>2</li>
<li>3</li>
</div>
*/
//console.log(far.innerText);
/*
1
2
3
*/
/*
获取前一个兄弟节点(也可能获取到空白文本)
previousSibling
*/
var li2 = document.getElementById("li2");
var bor = li2.previousSibling;
// alert(bor);//obj Text
/*
获取前一个兄弟元素(不会获取到空白文本了),IE8及以下不支持
previous
*/
var borEle = li2.previousElementSibling;
// alert(borEle);//object HTMLLIElement
}
</script>
</head>
<body>
<div id="box1">
<div id="box2">
<li id="li1">1</li>
<li id="li2">2</li>
<li>3</li>
</div>
</div>
</body>
</html>
“相关推荐”对你有帮助么?
-
非常没帮助
-
没帮助
-
一般
-
有帮助
-
非常有帮助
提交