1.对于getComputedStyle()方法 即便浏览器支持border 但表示值的方式可能会有区别,因此在使用getComputedStyle()方法是,最好先在几个浏览器中测试下 (注):IE有个myDiv.currentStyle与之等价 以上计算的样式都是只读的。

2.应用于文档的所有样式表用document.styleSheets集合表示 。可以使用sheet = element.sheet || element.styleSheet 表示获取样式表对象的内容;这里使用这种方法返回的样式与document.styleSheets集合中的样式表对象相同

3.取得第一条规则的方法如下:var sheet = document.styleSheets[0] ;  var rules = sheet.cssRules || sheet.rules;  var rule = rules[0]; alert(rule.selectorText); alert(rule.style.width); 也可以同时对其进行设值 如rule.tyel.width = 200px;

4.跨浏览器向样式表插入规则sheet.insertRule (除IE支持) sheet.addRule(IE支持) 其中sheet的值为document.styleSheets[0]因此代码如下:

   function insertRule(sheet,selectorText,cssText,position){

      if (sheet.insertRule){

          sheet.insertRule(selectorText + "{" + cssText + "}" , position);  

      }   else  if  (sheet.addRule){

          sheet.addRule(selectorText,cssText,position);

      }

}  然后用insertRule(document.styleSheet[0],"body","width:200px",0);来调用 //不怎么实用

5.跨浏览器删除规则sheet.deleteRule(0)DOM方法 sheet.removeRule(0)仅对IE有效代码如下:

    function deleteRule(sheet, index){

         if(sheet.deleteRule){

            sheet.deleteRule(index);        

         } else if (sheet.removeRule) {

            sheet.removeRule(index);

         }   

    } 然后使用deleteRule(document.styleSheet[0], 0); //这个方法也不实用;

6.偏移量 有4个属性取得元素的偏移量offsetHeight:元素在垂直方向上占用的空间大小,以像素计。包括元素的高度,(可见的)水平滚动条的高度、上边框高度和下边框高度 offsetWidth:元素在水平方向上占用的空间大小,以像素计。包括元素的宽度,(可见的)水平滚动条的宽度、左边框宽度和右边框宽度 offsetLeft:元素的左外边框至包含元素的左内边框之间的像素距离 offsetTop:元素的上外边框至包含元素的上内边框之间的像素距离  以上的属性都是只读的,每次访问都要重新计算

7.客户区大小:是元素内容及其内边距所占据的大小有关属性有clientWidth和clientHeight 他们不包括边框的大小。以上的属性都是只读的,每次访问都要重新计算

8.滚动大小:指包含滚动内容的元素大小。属性有scrollHeight scrollWidth(在没有滚动条的情况下,为元素内容的总高度和总宽度) scrollLeft 和scrollTop:被隐藏内容区域左侧或上方的像素数 可以通过设置这个属性改变元素的滚动位置 。实例如下

  <body>
<div style="width:200px;height:200px;background-color:orange;overflow:auto;" );
   }
   //注意橙色的一块没有动
</script>

相关文章:

  • 2021-05-23
  • 2022-12-23
  • 2021-09-24
  • 2021-11-26
  • 2021-05-20
  • 2021-10-04
猜你喜欢
  • 2021-08-18
  • 2022-12-23
  • 2021-11-05
  • 2022-01-16
  • 2021-04-06
  • 2021-07-01
  • 2021-10-30
相关资源
相似解决方案