如何用JS修改已加载的CSS样式表样式?

JavaScript012

如何用JS修改已加载的CSS样式表样式?,第1张

js是无法直接修改css文件的,但可以通过取对象的方式修改对象的样式,通常有两种方法:

1、改变className,但首先在样式表中预设定样式类。

例如:document.getElementById('obj').className='...'

2、改变cssText。

例如:document.getElementById('obj').style.height='100px'

举例1:

<li onmouseover='this.className='AAAAA'' onmouseout='this.className='BBBBB''>

鼠标经过 样式表变化 可用于 颜色变化等

举例2:

用户名:<input type="button" class="input1" onclick="this.className='input2'">

鼠标点击 样式表变化

或者 单独写一个javascript函数

举例3:

<script language=javascript>

function ChangeStyle(idName,StyleName){

document.getElementById(idName).className=StyleName

}

</script>

<input type=button onclick="ChangeStyle(Text1,"div2")" vaule="变换">

<div id=Text1 class=div1>啊哈哈哈哈</div>