JavaScript修改CSS
JavaScript修改CSS
1、修改元素的CSS名称：
<script language="JavaScript">
function change(id, newClass)
{
identity=document.getElementById(id);
identity.className=newClass;
}
</script>
<style type="text/css">
.first {
color: black;
}
.second
{
color: red;
}
</style>
<h1 class="first" id="changeme">Changeable text</h1>
<a href="javascript:;" onClick="change('changeme', 'second');">RED</a> | <a href="javascript:;" onClick="change('changeme', 'first');">BLACK</a>
2、修改CSS的属性
<script language="JavaScript">
function changecss(theClass,element,value)
{
var cssRules;
if (document.all)
{
cssRules = 'rules';
}
else if (document.getElementById)
{
cssRules = 'cssRules';
}
for (var S = 0; S < document.styleSheets.length; S++)
{
for (var R = 0; R < document.styleSheets[S][cssRules].length; R++)
{
if (document.styleSheets[S][cssRules][R].selectorText == theClass)
{
document.styleSheets[S][cssRules][R].style[element] = value;
}
}
}
}
</script>
<span class="exampleA">Example A</span>
<span class="exampleB">Example B</span>
<span class="exampleA">Example A</span>
<input type="button" value="Change A Red" onclick="changecss('.exampleA','color','red')"/>
<input type="button" value="Change A Black" onclick="changecss('.exampleA','color','black')"/>