美文网首页
DOM节点2

DOM节点2

作者: 与时光流浪 | 来源:发表于2016-08-10 11:40 被阅读0次

    一、offsetParent : 离当前节点最近的具有定位属性的祖先节点。

    如果所有祖先节点都没有定位属性:

    1.对于一个有定位属性的元素:

    ie6、7 : offsetParent 是 html 节点

    其它浏览器: offsetParent 是 body 节点

    2. 对于一个没有定位的元素:

    ie6/7 : 最近的一个触发了 haslayout 属性的祖先节点,如果所有祖先节点都没有触发 haslayout ,默认为 body 节点。

    其它浏览器: body。

    注:haslayout 是Windows Internet Explorer渲染引擎的一个内部组成部分,大多IE下的显示错误,就是源于 haslayout

    hasLayout属性是微软特有的过时属性,在IE8、IE9中,hasLayout属性已经被废弃

    3. 如果当前节点有 display:none; 属性 在 ie11 以上及标准浏览器,offsetParent为null,ie10以下浏览器不受影响。

    二、offsetLeft : 当前节点左边到 offsetParent 左边的距离。

    offsetTop : 当前节点上边到 offsetParent 上边的距离。

    注意:

    1,如果body和html有边框和外边距, offsetLeft 和 offsetTop 在所有浏览器下的取值都会不一样。

    2,在ie6、7浏览器下 ,offsetLeft和offsetTop会计算 offsetParent 的边框值,其它浏览器不会计算边框值。

    3,如果当前节点设置了 display: none; 属性,offsetTop 和 offsetLeft 的值都为0.(ie6/7下为 -1);

    温馨提醒:没有 offsetRight 和  offsetBottom 属性!

    三、offsetWidth : width + padding + border

    clientWidth : width + padding

    offsetHeight : height + padding + border

    clientHeight : height + padding

    以上四个属性指的是元素在页面中所占空间大小,如果元素没有占页面空间,四个属性的值都为 0 。

    相关文章

      网友评论

          本文标题:DOM节点2

          本文链接:https://www.haomeiwen.com/subject/upfjsttx.html