<html>
<head>
</head>
<body>
<form name="a ">
<table name="b ">
<tr name="c ">
<td name="d "><select name="e "
onchange="xx(this.parentElement.parentElement.parentElement.parentElement.parentElement.name) ">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select></td>
<td> </td> </tr>
<tr> 
</tr>
</table>
</form>
</body>
<script language="javascript" type="text/javascript">
function xx(a) {
alert(a);
}
</script>
</html>

注意parentELement第一个时返回的是当前元素对象

结果输出a,这个测试是在IE下面进行的,firefox无效

http://www.w3school.com.cn/css/pr_class_position.asp

先是 parentElement 属性,这个属性好理解,就是在 DOM 层次结构定义的上下级关系,如果元素A包含元素B,那么元素B就可以通过 parentElement 属性来获取元素A。
这里主要说的是 offsetParent 属性,这个属性在 MSDN 的文档中也没有解释清楚,这就让人更难理解这个属性。 这几天在网上找了些资料看看,再加上自己的一些测试,对此属性有了那么一点的了解,在这里总结一下。
要明白 offsetParent 属性,要先明白“已定位元素” 这个名字,所谓“已定位元素”就是指给元素设置了 position 属性的样式,并且 position 样式属性的值等于 absolute、relative、fixed 之一的元素。
在使用 offsetParent 属性获取父级对象时有以下两种情况:
    1、元素本身已经定位
        如果元素本身已经定位,那么 offsetParent 属性返回此元素已定位父级元素,如没有已定位的父级元素,则返回 BODY 对象,例如:
复制代码 代码如下:
<body>
<p>
<div>
<span id="obj1" style="position:absolute"></span>
</div>
<div id="pObj1" style="position:absolute">
<span id="obj2" style="position:absolute"></span>
</div>
</p>
</body>

obj1.offsetParent 返回 BODY 对象
    obj2.offsetParent 返回 pObj1 对象
    2、元素没有定位
        如果元素没有定位, offsetParent 不但会找已经定位的父级元素而且还会查找类型为 TD 和 TABLE 的父级元素,只要找到这三种父级元素的其中任何一种元素将返回此元素,否则返回 BODY 对象,例如:
复制代码 代码如下:
<table width="500" border="0">
<tr>
<td id="td1">
<div id="pObj1">
<span id="obj1"></span>
</div>
</td>
</tr>
<tr>
<td>
<div id="pObj2" style="position:relative">
<span id="obj2"></span>
</div>
</td>
</tr>
</table>

obj1.offsetParent 返回 td1 对象
    obj2.offsetParent 返回 pObj2 对象
在 DOM 元素的属性里,还有 parentNode 这个属性,其实这个属性跟 parentElement 属性是一个意思,parentElement 属性是 IE 特有的,W3C 标准是使用 parentNode 属性,还有 children 和 childNodes, children 是 IE 特有的, childNodes 被其他浏览支持
详细出处参考:http://www.jb51.net/article/22705.htm

js之parentElement属性的更多相关文章

  1. 简单理解js的prototype属性

    在进入正文之前,我得先说说我认识js的prototype这个东西的曲折过程. 百度js的prototype的文章,先看看,W3School关于prototype的介绍: 你觉得这概念适合定义js的pr ...

  2. JS中style属性

    解决办法:1.先定义一个CSS规则,然后this.className=''2.document.getElementByIdx_x("a").style.cssText=" ...

  3. JS获取网页属性包括宽、高等

    JS获取网页属性包括宽.高等. function getInfo()  { // www.jbxue.com var s = "";  s += " 网页可见区域宽:&q ...

  4. 用js控制css属性

    在用js控制css属性时,行内css属性可以任意控制,但若是在<style></style>中写的css属性,均不能用alert读取,但是赋值却有几种现象, 第一种:无法读取, ...

  5. jQuery与js的length属性

    js:length 属性可返回字符串中的字符数目. stringObject.length jQuery:length 属性包含 jQuery 对象中元素的数目. $(selector).length ...

  6. js 获取对象属性个数

    js 获取对象属性个数 方法一: var attributeCount = function(obj) { var count = 0; for(var i in obj) { if(obj.hasO ...

  7. Vue.js:计算属性

    ylbtech-Vue.js:计算属性 1.返回顶部 1. Vue.js 计算属性 计算属性关键词: computed. 计算属性在处理一些复杂逻辑时是很有用的. 可以看下以下反转字符串的例子: 实例 ...

  8. JS获取元素属性和自定义属性

    获取元素的属性分为两种类型: 1-获取元素常见的属性(class,id,type,value……) 2-获取自定义的元素的属性(data-value,data-mess…….) 获取元素的属性,设置元 ...

  9. js dom element 属性整理(原创)

    最近去几家公司面试,发现大多数时候面试的内容考的都是原生的js语法和属性,所以我决心整理一下原生的dom元素的属性. 首先,我我们需要获取一个element元素 <li id="2&q ...

随机推荐

  1. windows2003远程桌面退出后系统自动注销的解决方法

    最近公司有一个奇怪的需求,意思是有一个网页,要时时的打开着.现在只有把这个网页在服务器上打开. 这样才能满足需求.但我在应用中遇见了个问题.我在服务器上打开网页后,关掉远程,过一会网页的运行效果就没有 ...

  2. SharePoint 2010 master page 控件介绍(4):隐藏placeholder

    转:http://blog.csdn.net/lgm97/article/details/6409225 <!-- form digest  安全控件用来进行form的安全校验--> &l ...

  3. SQL游标

    最近工作中有用到游标,特简单总结一下: 一.简介      游标(Cursor)是处理数据的一种方法,为了查看或者处理结果集中的数据,游标提供了在结果集中一次以行或者多行前进或向后浏览数据的能力.我们 ...

  4. jetty属性

    jetty 版本信息      Jetty7 - 此插件更名为jetty-maven-plugin,以便更符合maven2的协定.为了在Web应用做快速应用开发做准备,详见多Web应用源目录.   为 ...

  5. selenium Grid

    Selenium Grid 的机制是启动一个 hub,然后启动多个 Selenium RC 注册到 hub 上, 当测试请求到 hub 时,hub 会将测试分发给 Selenium RC, Selen ...

  6. getsockopt/setsockopt 函数说明

    [ getsockopt/setsockopt系统调用]       功能描述: 获取或者设置与某个套接字关联的选 项.选项可能存在于多层协议中,它们总会出现在最上面的套接字层.当操作套接字选项时,选 ...

  7. 题目1023:EXCEL排序(多关键字+快排+尚未解决)

    http://ac.jobdu.com/problem.php?pid=1023 题目描述: Excel可以对一组纪录按任意指定列排序.现请你编写程序实现类似功能. 对每个测试用例,首先输出1行“Ca ...

  8. maven 本地仓库的设置

    设置方式一: 安装好maven后,在maven安装目录的conf文件夹下有一个settings.xml文件,该文件就是用来配置maven的一些常用参数 %MAVEN% / conf / setting ...

  9. SQL2008-中不想插入从复记录

    If not exists (SELECT ID FROM StuffAgitationYield where EMAgitation_ID=1 and YieldDateTime'2012-06-1 ...

  10. Modbus Poll :Byte Missing Error或CRC Error

    原因: 1.通信线路受干扰或是路线接触不良:    用显示器测量物理电平信号   2.从机工作不正常: 检测电源不正常或查程序bug   3.PC主机串口不正常: PC串口2.3脚答短接用串口调试器测 ...