<!DOCTYPE html>
<html>
<head>
<meta charset="{CHARSET}">
<title></title>
<script>
window.onload = function(){
var aA = document.getElementsByTagName('a');
for(var i=0;i<aA.length;i++){
aA[i].onclick = function(){
//元素.parentNode:只读 属性 当前节点的父级节点
this.parentNode.style.display = 'none';
}
}
}
</script>
</head>
<body>
<ul id="ul1">
<li>1111111111 <a href="javascript:;">hidden</a></li>
<li>1111111111 <a href="javascript:;">hidden</a></li>
<li>1111111111 <a href="javascript:;">hidden</a></li>
<li>1111111111 <a href="javascript:;">hidden</a></li>
</ul>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="{CHARSET}">
<title></title>
<style>
#div2{
position: absolute;
}
</style>
<script>
window.onload = function(){
var oDiv3 = document.getElementById('div3');
//元素.offsetParent:只读 属性 离当前元素最近的一个有定位的父节点，（如没定位父级，默认是body）
alert(oDiv3.offsetParent.id);
}
</script>
</head>
<body>
<div id="div1">
<div id="div2">
<div id="div3">
</div>
</div>
</div>
</body>
</html>
offsetParent
注意兼容性问题：
ie7以下，如果当前元素没有定位默认是body，如果有定位则是html
ie7以下，如果当前元素的某个父级触发了layout，那么offsetParent就会被指向到这个出发了layout特性的父节点上
<!DOCTYPE html>
<html>
<head>
<meta charset="{CHARSET}">
<title></title>
<style>
#div2{
z-index: 1;
}
</style>
<script>
window.onload = function(){
var oDiv3 = document.getElementById('div3');
alert(oDiv3.offsetParent.id);
}
</script>
</head>
<body>
<div id="div1">
<div id="div2">
<div id="div3">
</div>
</div>
</div>
</body>
</html>
3100
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
