新手 开灯关灯效果

复制代码
 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3 
 4 <head>
 5  
 6 
 7 <title>简单的开灯关灯效果</title>
 8     <style type="text/css">
 9         .cls
10         {
11             background-color: Gray;
12         }
13     </style>
14     <script src="jquery-1.10.2.js" type="text/javascript"></script>
15     <script type="text/javascript">
16         $(function () {
17             $('#Btn').click(function () {
18                 if ($('body').hasClass('cls')) {
19                     $('body').removeClass('cls');
20                     $('#Btn').val('关灯');
21                 } else {
22                     $('body').addClass("cls");
23                     $('#Btn').val('开灯');
24                 }
25 
26             });
27         });
28     </script>
29 
30 </head>
31 <body>
32     <input type="button" value="开灯/关灯" id="Btn" />
33 </body>
34 </html>
复制代码

一个简单的模拟。

posted @   wolfy  阅读(948)  评论(7)  编辑  收藏  举报
编辑推荐：
· .NET Core 中如何实现缓存的预热？
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列：向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列：如何用heaptrack跟踪.NET程序的非托管内存泄露
阅读排行：
· TypeScript + Deepseek 打造卜卦网站：技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗？
· 【译】Visual Studio 中新的强大生产力特性
· 【设计模式】告别冗长if-else语句：使用策略模式优化代码结构
· 10年+ .NET Coder 心语 ── 封装的思维：从隐藏、稳定开始理解其本质意义
点击右上角即可分享
微信分享提示
SQL AI 助手