记录：用js改变css样式的集中方法_js中css样式修改-CSDN博客

本文链接：https://blog.csdn.net/Mantra86/article/details/81125768

<!DOCTYPE html>
<html>
   <head>
       <meta charset="UTF-8">
       <title></title>
       <style>
           .col{
               color: red;
           }
       </style>
   </head>
   <body>
       <p id="p">茅总是傻逼</p><input type="button" value="点击一下" id="btn1"/>
       <input type="button" value="点击一下" id="btn2"/>
       <input type="button" value="点击一下" id="btn3"/>




       <script>
           var p = document.getElementById("p");
           var btn1=document.getElementById("btn1");
           btn1.οnclick=function(){
               p.style.color ="red";
           }


           var btn2=document.getElementById("btn2");
           btn2.οnclick=function(){
//           p.style.cssText="color:yellow"
           p.setAttribute("style","color:red")
           }

           var btn3 = document.getElementById("btn3")
           btn3.onclick = function(){
               p.style.setProperty("color","blue")
           }
       </script>
   </body>
</html>