用JavaScript修改CSS屬性

　　只有寫原生的javascript了

　　用JS修改標簽的 class 屬性值

　　class 屬性是在標簽上引用樣式表的方法之一它的值是一個樣式表的選擇符如果改變了 class 屬性的值標簽所引用的樣式表也就更換了所以這屬於第一種修改方法

　　更改一個標簽的 class 屬性的代碼是

　　documentgetElementById( id )className = 字符串;
documentgetElementById( id ) 用於獲取標簽對應的 DOM 對象你也可以用其它方法獲取className 是 DOM 對象的一個屬性它對應於標簽的 class 屬性字符串 是 class 屬性的新值它應該是一個已定義的CSS選擇符

　　利用這種辦法可以把標簽的CSS樣式表替換成另外一個也可以讓一個沒有應用CSS樣式的標簽應用指定的樣式

　　舉例

　　<style type="text/css">
txt {
fontsize: px; fontweight: bold; color: red;
}
</style>
<div id="tt">歡迎光臨！</div>
<p><button onclick="setClass()">更改樣式</button></p>
<script type="text/javascript">
function setClass()
{
documentgetElementById( "tt" )className = "txt";
}
</script>

　　用JS修改標簽的 style 屬性值
style 屬性也是在標簽上引用樣式表的方法之一它的值是一個CSS樣式表DOM 對象也有 style 屬性不過這個屬性本身也是一個對象Style 對象的屬性和 CSS 屬性是一一對應的當改變了 Style 對象的屬性時對應標簽的 CSS 屬性值也就改變了所以這屬於第二種修改方法

　　更改一個標簽的 CSS 屬性的代碼是

　　documentgetElementById( id )style屬性名 = 值;
documentgetElementById( id ) 用於獲取標簽對應的 DOM 對象你也可以用其它方法獲取style 是 DOM 對象的一個屬性它本身也是一個對象屬性名 是 Style 對象的屬性名它和某個CSS屬性是相對應的

　　說明這種方法修改的單一的一個CSS屬性它不影響標簽上其它CSS屬性值

　　舉例

　　div id="t">歡迎光臨！</div>
<p><button onclick="setSize()">大小</button>
<button onclick="setColor()">顏色</button>
<button onclick="setbgColor()">背景</button>
<button onclick="setBd()">邊框</button>
</p>
<script type="text/javascript">
function setSize()
{
documentgetElementById( "t" )stylefontSize = "px";
}
function setColor()
{
documentgetElementById( "t" )stylecolor = "red";
}
function setbgColor()
{
documentgetElementById( "t" )stylebackgroundColor = "blue";
}
function setBd()
{
documentgetElementById( "t" )styleborder = "px solid #FA";
}
</script>

From:http://tw.wingwit.com/Article/program/Java/JSP/201311/20011.html