你的位置:首页 > 软件开发 > Java > scrollWidth,offsetWidth,clientWidth,width;scrollHeight,offsetHeight,clientHeight,height;offsetTop,scrollTop,top;offsetLeft,scrollLeft,left还有谁

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

发布时间:2017-04-03 00:00:24
题中的那么多属性让人头都大了,他们到底是什么意思?不同浏览器的实现是一样的吗?以下所有结论来自chrome版本 53.0.2785.89 (64-bit)和firefox版本52.0.2,操作系统ubuntu16.04的测试,关于IE及其它浏览器并没有考虑。一、谈谈XXWidth ...

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"><head>  <meta charset="UTF-8">  <title>1</title>  <style type="text/css">    div{      width: 100px;      height: 100px;      border: 20px;      margin: 20px;      padding: 20px;      background: red;    }  </style></head><body>  <div id="div"></div>  <script type="text/javascript">     var link = document.getElementsByTagName("style")[0];    var sheet = link.sheet||link.styleSheet;    var rules = sheet.rules || sheet.cssRules;    console.log(rules[0].style.width);  </script></body></html>

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

关键词:ie

ie
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。