jS 赋值给CSS 怎么操作

html-css035

jS 赋值给CSS 怎么操作,第1张

<div id="did" class="defcls"></div>

js 使用  ...style.[css属性（第二个首字母大写）]

var dom = document.getElementById( "did" )

      dom.style.color = "#000"

      dom.style.fontSize = "30px"

因为js选择元素很麻烦，所以建议引入jquery 库，操作元素很方便。也是常用的做法。

jquery

$('.defcls').css({color:'#000',fontSize:'20px'})

以上是直接修改元素的属性。直接修改 CSS样式表 就很麻烦了，一般不这样做。

js直接修改页面中的CSS样式表

var Hsheet = window.frames.wpages.document.styleSheets[0]//找到样式表

function setRules(name){

   for(var i = 0 i < Hsheet.cssRules[0].cssRules.length i++){

     if(Hsheet.cssRules[0].cssRules[i].selectorText===name){ //找到样式

Hsheet.cssRules[0].cssRules[i].style.color = "#000"

break

     }

   }

}

setRules('defcls')

这个方式比较罕见，只有在即为特殊的情况下，才会直接修改样式表，也是效率最低的一种。

推荐使用jquery代码

<script type="text/javascript" src="1.js"></script>

<script type="text/javascript">

$(document).ready(function(){

$('.aaa').css('width','100px')

})

</script>