這篇文章主要介紹了Javascript通過控制類名更改樣式,下面來和小編一起來學習吧
控制類名(className 屬性)
className 屬性設置或返回元素的class 屬性。
語法:
object.className = classname
作用:
1.獲取元素的class 屬性
2. 爲網頁內的某個元素指定一個css樣式來更改該元素的外觀
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>className屬性</title> <style> body{ font-size:16px;} .one{ border:1px solid #eee; width:230px; height:50px; background:#ccc; color:red; } .two{ border:1px solid #ccc; width:230px; height:50px; background:#9CF; color:blue; } </style> </head> <body> <p id="p1" > JavaScript使網頁顯示動態效果並實現與用戶交互功能。</p> <input type="button" value="添加樣式" onclick="add()"/> <p id="p2" class="one">JavaScript使網頁顯示動態效果並實現與用戶交互功能。</p> <input type="button" value="更改外觀" onclick="modify()"/> <script type="text/javascript"> function add(){ var p1 = document.getElementById("p1"); p1.className="one"; } function modify(){ var p2 = document.getElementById("p2"); p2.className="two"; } </script> </body> </html>
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持神馬文庫。