jquery offsetParent()源码解读

浏览数：23 / 时间：2015年06月09日 
    offsetParent: function() {
        return this.map(function() {
            var offsetParent = this.offsetParent || docElem;

            while ( offsetParent && ( !jQuery.nodeName( offsetParent, "html" ) && jQuery.css( offsetParent, "position") === "static" ) ) {
                offsetParent = offsetParent.offsetParent;
            }

            return offsetParent || docElem;
        });
    }

代码比较简单，首先它return this.map(function(){}) 所以返回的是一个数组。。。

获取当前元素的offsetParent，如果没有的话就是documentElement

jQuery.nodeName("offsetParent","html")是为了判断当前的offsetParent是否是html,然后jQuery.css( offsetParent, "position") === "static" ) 判断offsetParent是否是static...

但是问题来了，什么时候while为true呢？

( !jQuery.nodeName( offsetParent, "html" )排除了html,但是还有一个body我们不能忽略。

然后我发现。。
console.log(document.getElementById(‘div‘).offsetParent);
    console.log($(‘#div‘).offsetParent());

技术分享

原生返回body而jQuery返回html

原因，刚在stackoverflow上问了一下，确实，不管jquery返回html或者body都不重要，反正都是说明当前元素没有一个有定位的祖先元素，而jquery返回html的原因，可能就是想做一下标准化吧。。

（PS~stackoverflow相当给力啊，其他的回答明天再看好了，滚回去碎觉。。。）

郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。

标签： class style log com 代码 src http html si class style log com 代码 src http html si

相关文章

随机文章

您可能还喜欢

您可能还喜欢