parentelement,parentelement parentnode

http://www.itjxue.com  2023-01-23 10:14  来源:未知  点击次数: 

JS中的parentElement,parentNode,childNodes,children,[object text]问题

parentElement 获取对象层次中的父对象。

parentNode 获取文档层次中的父对象。

childNodes 获取作为指定对象直接后代的 HTML 元素和 TextNode 对象的集合。

children 获取作为对象直接后代的 DHTML 对象的集合。

parentNode和parentElement功能一样,childNodes和children功能一样。但是parentNode和childNodes是符合W3C标准的,可以说比较通用。而另外两个不是标准,Firefox就不支持。

当父节点的nodeType不是1,即不是element节点的话,它的parentElement就会是null

一般情况parentNode可以取代parentElement的所有功能。

parentElement匹配的是parent为element的情况,而parentNode匹配的则是parent为node的情况。element是包含在node里的,它的nodeType是1。

javascript的parentNode,parentElement

如楼上所说,parentElement是IE专用,它们俩功能是一样的,文档中所有对象都扩展自Node对象,包括document,documentElement...等,或者说所有对象都是Node对象,而所有Element对象也都扩展自Node对象,Element对象是可见的,即标签或元素对象,但我认为对象层次和文档层次区分是没有意义的,因为它们实现同样功能,一般为了兼容,都是用parentNode,我们只要知道怎么用就行了,就如:img元素对象和image对象,哈哈,其实我也不理解什么是对象层次和文档层次!只要我们能熟练操纵DOM树就可以了...

举个例子:

table

tr

p

td id="haha"haha/td

/p

/tr

/table

我们用俩种方法在IE下取得都是P元素对象,而在firefox下用parentNode,取得的是tr元素对象

个人见解,如有不确切之处请说出来,不盛感激!!!

js parentElement和offsetParent之间的区别

首先是 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 被其他浏览支持。

(责任编辑:IT教学网)

更多

推荐java认证文章