首页 > 编程语言 > 详细

JavaScript访问修改css样式表

时间:2016-04-23 21:24:52      阅读:257      评论:0      收藏:0      [点我收藏+]

1.访问元素中style属性的css样式

   可以根据属性的ID或name标签利用dom操作直接访问到内部的css样式,直接使用style对象访问

  <div id="myid" style="backgroundColor:blue;"></div>

 

<script type="text/javascript">

var mydiv1=document.getElementById("myid");

alert(mydiv1.style.backgroundColor);

</script>

 

2.访问外部定义的css样式

 外部css是存储在类中,不是存储在style属性中,我们需要借助于类的样式表。我们先取得定义类的样式表的引用,用document.stylesheets集合实现这个目的,这个集合中包含html页面中所有的样式,dom为每个样式表定义一个cssRules的集合,这个集合中包含定义在样式表中所用的css规则(IE中是用rules)。

css样式表:

第一条规则

div{

 background-color:blue;

 width:200px;

 height:200px;

}

第二条规则

a.btn1{

  background:url(imag/1.jpg);

}

 

 

访问css

var mycssRules=document.stylesheets[0].cssRules||document.stylesheets[0].rules;

//访问第一条规则

alert(mycssRules[0].style.backgroundColor);

//设置值

mycssRules[0].style.backgroundColor="black";

 

//访问第二条规则

alert(mycssRules[1].style.background);

//设置值

mycssRules[1].style.background="url(imag/2.jpg)";

JavaScript访问修改css样式表

原文:http://www.cnblogs.com/haimengqingyuan/p/5425417.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!