1、新建一个html代码页面
2、创建一个input按钮标签，然后给这个按钮添加一个changeBg()的点击事件代码：<input type="button" value="点击切换背景色" onclick="changeBg()"/>
3、创建style标签，然后创建一个class类为btn用于设置按钮样式，其中按钮的背景设置水瑞侮瑜background-color: #009F95 !important;代码：<style type="text/css"> .btn{ border:1px solid #ddd; padding: 5px 8px; background-color: #009F95 !important; } </style>
4、给按钮input标签添加class = "btn"代码：<input type="button" class="btn" value="点击切换背景色" onclick="changeBg()"/>
5、引入jquery库，然后新建一个script标签，在这个标签里为changeBg()点击事件添加修改按钮的背景色changeBg()修改背景色代码：function changeBg(){ $(".btn").css("cssText", "background-color:red !important;"); }
6、保存html代码页面后使用浏览器打开，点击按钮后发现按钮背景色被修改为红色。
7、所有代码。可以直接复制所有代码，然后修改引入的jquery.js文件，保存后使用浏览器打开点击后即可看到效果。所有代码：<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> .btn{ border:1px solid #ddd; padding: 5px 8px; background-color: #009F95 !important; } </style> <script type="text/javascript" src="js/jquery-3.3.1.min.js" ></script> <script> function changeBg(){ $(".btn").css("cssText", "background-color:red !important;"); } </script> </head> <body> <input type="button" class="btn" value="点击切换背景色" onclick="changeBg()"/> </body></html>
