jQuery之开关灯示例
Posted Fugui
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了jQuery之开关灯示例相关的知识，希望对你有一定的参考价值。
准备jquery-3.2.1.js文件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> .c11 { height: 100px; width: 100px; border-radius: 50%; border: 1px solid #cccccc; display: inline-block; } .c12 { background-color: yellow; } </style> </head> <body> <div class="c11"></div> <button id="switch" class="btn btn-default">开关</button> <script src="jquery-3.2.1.js"></script> <script> // id选择器 // $("#i1") // $("#switch")[0].onclick = function () { // .... // } //jQuery绑定事件 $("#switch").on("click", function () { // 找灯泡 $(".c11").toggleClass("c12"); }) </script> </body> </html>
以上是关于jQuery之开关灯示例的主要内容，如果未能解决你的问题，请参考以下文章