在JavaScript中,可以利用setAttribute()方法來透過類別修改css樣式,只需要修改指定元素的「class」屬性值即可,語法「元素物件.setAttribute("class", "新類別名稱");」。
本教學操作環境:windows7系統、javascript1.8.5版、Dell G3電腦。
在JavaScript中,可以利用setAttribute()方法來透過類別修改css樣式。
下面透過程式碼範例來具體看看:
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <style> .style1{ height: 50px; border: 1px solid red; } .style2{ border: 3px dashed #AFEEEE; padding: 10px; } </style> </head> <body> <div id="style" class="style1">测试文本</div><br /> <input type="button" value="更改类名" onclick="changeStyle()" /> </body> <script> function changeStyle() { var obj = document.getElementById("style"); obj.setAttribute("class", "style2"); } </script> </html>
效果圖:
##說明:
setAttribute() 方法新增指定的屬性,並為其賦指定的值。 如果這個指定的屬性已存在,則只設定/更改值。 語法element.setAttribute(attributename,attributevalue)
#類型 | 描述 | |
---|---|---|
attributename | String#必要。您希望新增的屬性的名稱。 | |
attributevalue | String必要。您希望新增的屬性值。 |
css影片教學)
以上是js怎麼透過類別來修改css樣式的詳細內容。更多資訊請關注PHP中文網其他相關文章!