本文目录一览:
- 1、javascript中input.parentElement.className中parentElement是什么意思啊?
- 2、js parentElement和offsetParent之间的区别
- 3、parentNode属性什么意思
- 4、javascript的parentNode,parentElement
javascript中input.parentElement.className中parentElement是什么意思啊?
input应该是一个变量了,HTML元素是有父子层关系的,比如
div id="divF" class="MyDiv"
div id="divS" /
/div
那么里面这个divS.parentElement就是divF,
那么divS.parentElement.className就是指的"MyDiv"
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
被其他浏览支持。
parentNode属性什么意思
parentNode 属性以 Node 对象的形式返回指定节点的父节点。
parentNode跟parentElement除了前者是w3c标准,后者只ie支持。当父节点的nodeType不是1,即不是element节点的话,它的parentElement就会是null。一般情况parentNode可以取代parentElement的所有功能。parentElement匹配的是parent为element的情况,而parentNode匹配的则是parent为node的情况。element是包含在node里的,它的nodeType是1。-parentelement
javascript的parentNode,parentElement
如楼上所说,parentElement是IE专用,它们俩功能是一样的,文档中所有对象都扩展自Node对象,包括document,documentElement...等,或者说所有对象都是Node对象,而所有Element对象也都扩展自Node对象,Element对象是可见的,即标签或元素对象,但我认为对象层次和文档层次区分是没有意义的,因为它们实现同样功能,一般为了兼容,都是用parentNode,我们只要知道怎么用就行了,就如:img元素对象和image对象,哈哈,其实我也不理解什么是对象层次和文档层次!只要我们能熟练操纵DOM树就可以了... -parentelement
举个例子:
table
tr
p
td id="haha"haha/td
/p
/tr
/table
我们用俩种方法在IE下取得都是P元素对象,而在firefox下用parentNode,取得的是tr元素对象
个人见解,如有不确切之处请说出来,不盛感激!!!