js操作css

来源:百度知道 编辑:UC知道 时间:2024/05/25 05:58:26
比如在我的head里有
<style id="aaaa">
.a{
font-size:36px;
}
</style>
我该如何操作这个style.
var div1 = document.getElementById("aaaa");
div1.innerHTML;
可以看到里面的内容
1,如何把里面的内容清除,即:
<style>
</style>
2,如何向其中加入新的样式,如:
<style>
.b{color:#007700}
</style>
我是说在head里预先定义好的
<html>
<head>
<title></title>
<style id="aaaa">
.a{
font-size:36px;
}
</style>
</head>
</html>
这么一段css。我要怎么去操作他,而不是
<div style="size:16" id="div001">1111</div>这样去操作。

谢谢楼下的2为朋友,那些基本常用的操作都好说,现在项目需求就是这样的,所有的样式在head里的style中定义好,需要切换皮肤的时候需要把<style></style>里的东西全都替换成另外一套。而且目前不能用外部的css.(项目初期不知道他们怎么设计的)来实现我要的效果。因此我才请问各位达人如何对<style></style>进行操作。

4楼的朋友
var style2 = "a{...} b{....}

你用这个方法吧:
写几个样式在<head>里:
<style id="style1">
...
</style>
<style id="style2">
...
</style>

var styleSheets = document.document.styleSheets;
for(var i=0,length=styleSheets.length;i<length;i++){
styleSheets[i].disabled = true; //先全部取消
}
//激活要选用的style
document.getElementById('style2').disabled = false;

强烈建议你不要再js里面给页面元素新写样式。可以修改但是不要增加诸如.b{font-size:12px;} 这样的东西。

CSS一定要先写好了。然后用js来控制class名称。

比如你这个,最好写好了
.a {font-size:36px;}
.b {font-size:12px;}

var div1 = document.getElementById("aaaa");
div1.innerHTML;
如果想去掉div1 上的class="a"
那就 div1.className = '';
也可以直接 div1.className = 'b';
这样来用b样式替换掉a样式。

关于具体样式的操作如楼上朋友所说。
div1.style.fontSize='12px;'
div1.style.backgroundColor='#000'
等等。。

用js操控css其实就是

元素.s