javascript操作class和style样式
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了javascript操作class和style样式相关的知识，希望对你有一定的参考价值。
1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>无标题文档</title> 6 <style> 7 .fontSize22 8 { 9 font-size:22px; 10 } 11 .fontWeight 12 { 13 font-weight:bold; 14 } 15 </style> 16 </head> 17 18 <body> 19 <div id="div1" class="fontSize22 fontWeight" style="color:red">div实例文本</div> 20 <button onclick="changeStyle()">changeStyle()</button> 21 <script> 22 function changeStyle() 23 { 24 var div1 = document.getElementById("div1"); 25 //div1.className = "fontSize22"; 26 //div1.className += " fontWeight"; 27 //删除单个class=""样式 28 //div1.className = div1.className.replace(/fontSize22/,""); 29 //删除所有class=""样式 30 //div1.removeAttribute("class"); 31 //删除style=""中的单个样式 32 div1.style.cssText = div1.style.cssText.replace(/red/,"blue"); 33 //删除style=""中的所有样式 34 //div1.style.cssText = ""; 35 } 36 </script> 37 </body> 38 </html>
以上是关于javascript操作class和style样式的主要内容，如果未能解决你的问题，请参考以下文章