offsetParent和parentNode区别

【offsetParent和parentNode区别】的更多相关文章

offsetParent和parentNode区别

offsetParent用的最普遍的就是来计算元素在页面中的位置,前面的日志理讲了通过getBoundingClientRect() 来获取页面中元素的位置,不过这只支持最新的浏览器,如果要兼容像Opera9.2和Firefox2以及Safair任何版本都只能通过offsetParent该属性来循环获计算获得元素的位置,效率不太好.贴一段缩减了来自YUI里的代码: function getElementXY(el){ //el 要获取位置的元素对象 var pos = [el.offsetLe…

javascrip中parentNode和offsetParent之间的区别

首先是 parentNode 属性,这个属性好理解,就是在 DOM 层次结构定义的上下级关系,如果元素A包含元素B,那么元素B就可以通过 parentElement 属性来获取元素A. 要明白 offsetParent 属性,要先明白“已定位元素” 这个名字,所谓“已定位元素”就是指给元素设置了 position 属性的样式,并且 position 样式属性的值等于 absolute.relative.fixed 之一的元素. 在使用 offsetParent 属性获取父级对象时有以下两种情况:…

DOM创建节点

1.DOM--document object model 常用的节点类型: 元素节点:(标签) 属性节点:(标签里的属性) 文本节点:(文本节点) 2,document有个属性叫nodetype,返回的是数字代表元素节点:属性节点:文本节点 3,节点的获取: 元素节点-- document.getelementById() document.getelementsByTagName() document.getelementsByClassName() document.queryselect…

offsetParent详解

offsetParent与parentNode一样,都是获取父节点,但是offsetParent却有很大的不同之处: offsetParent找有定位的父节点,没有定位默认是body,ie7以下定位在当前元素是html 怎么理解上面的话呢,其实这需要与css配合使用,我们先看例子: <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/h…

关于offsetParent

不知道有多少人知道JavaScript中有offsetParent这么个属性. 关于offsetParent,我最开始见到他,是在<JavaScript高级程序设计(第3版)>第321页,介绍元素大小—偏移量,引申出来的.看一下具体内容: offsetLeft和offsetTop属性与包含元素有关,包含元素的引用保存在offsetParent属性中. offsetParent属性不一定与parentNode的值相等. 例如:td元素的offsetParent是作为其祖先元素的table元素,因…

DOM

DOM:Document Object Model 文档对象模型文档:html页面文档对象:页面中的元素文档对象模型:定义为了能够让程序(js)去操作页面中的元素DOM会把文档看作是一棵树document > html > html(标签),同时定义了很多方法来操作这棵树中的没一个元素:DOM节点:操作子节点和兄弟节点:childNodes(不推荐使用)是一个属性,属性是不需要加括号,用某个对象来调用,它是一个子节点列表集合.只包含一级子节点,不包含孙级节点标准下元素节点包含文本节点,也包含…

scrollWidth,offsetWidth,clientWidth,width;scrollHeight,offsetHeight,clientHeight,height;offsetTop,scrollTop,top;offsetLeft,scrollLeft,left还有谁

题中的那么多属性让人头都大了,他们到底是什么意思?不同浏览器的实现是一样的吗?以下所有结论来自chrome版本 53.0.2785.89 (64-bit)和firefox版本52.0.2,操作系统ubuntu16.04的测试,关于IE及其它浏览器并没有考虑. 一.谈谈XXWidth 1.width 这个是style对象的一个属性,跟你在css样式里写的那个width的值是一样的,注意他是带单位的. <!DOCTYPE html> <html lang="en">…