jQuery实例之五:class的操作
来源:互联网 发布:网络推广图片 编辑:程序博客网 时间:2024/05/24 05:20
下面的实例是建立一个表格,对class进行动态操作效果如图所示:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>表格</title> <script src="jquery.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function(){ $("#table tr").mouseover(function(){ $(this).addClass("over"); }); $("#table tr").mouseout(function(){ $(this).removeClass("over"); }); $("#table tr:even").addClass("double"); });function removeEvenTdClass(){ $("#table tr:even").removeClass();} </script> <style type="text/css">th{background: gray;color: white;}table{width: 30em;height: 10em;}td {border-bottom:1px solid #95bce2;text-align:center;}tr.over td{font-weight: bold;}tr.double td{background: #DAF3F1;} </style></head><body> <table id="table" border="0" cellpadding="0" cellspacing="0"> <tr> <th>姓名</th> <th>年龄</th> <th>籍贯</th> <th>手机</th> </tr> <tr> <td>nlcold</td> <td>33</td> <td>湖南</td> <td>15988888888</td> </tr> <tr> <td>nlcold</td> <td>33</td> <td>湖南</td> <td>15988888888</td> </tr> <tr> <td>nlcold</td> <td>33</td> <td>湖南</td> <td>15988888888</td> </tr> <tr> <td>nlcold</td> <td>33</td> <td>湖南</td> <td>15988888888</td> </tr> <tr> <td>nlcold</td> <td>33</td> <td>湖南</td> <td>15988888888</td> </tr> <tr> <td>nlcold</td> <td>33</td> <td>湖南</td> <td>15988888888</td> </tr> <tr> <td>nlcold</td> <td>33</td> <td>湖南</td> <td>15988888888</td> </tr> <tr> <td>nlcold</td> <td>33</td> <td>湖南</td> <td>15988888888</td> </tr> <tr> <td>nlcold</td> <td>33</td> <td>湖南</td> <td>15988888888</td> </tr> </table> <input id="btnRemoveClass" name="btnRemoveClass" type="button" value="removeEvenTdClass" onclick="removeEvenTdClass()"/></body></html>
- jQuery实例之五:class的操作
- jquery对class的操作
- jQuery实例之实现对表格内容的操作
- jQuery开发之DOM操作五
- 样式class的操作及实例
- JQuery基础之(五)使用JQuery操作元素的属性和样式
- jQuery操作class
- jQuery操作Class
- jquery 操作 class 属性
- jquery class操作
- jQuery中的class操作
- [jQuery知识]jQuery之知识五-DOM节点操作
- [jQuery知识]jQuery之知识五-DOM节点操作
- jQuery快速入门基础教程之jQuery操作CSS(五)
- 40、实例 使用jQuery操作DOM之操作属性
- 41、实例 使用jQuery操作DOM之操作样式
- jQuery操作select的实例代码
- jQuery操作dom的一个实例
- 查阅 Oracle 官方文档解决 oracle 编程相关的问题
- VC深入浅出学习笔记(一)
- 给Android应用开发者的十个建议
- 复杂与简单——软件的发展历程
- java环境变量配置
- jQuery实例之五:class的操作
- cas localhost改成IP地址后 无法跳转
- Android中ListView的用法案例
- 修改Linux内核参数,减少TCP连接中的TIME-WAIT sockets
- WinINet 学习资料
- HTML5是否会取代Flex
- word2003如何去除空白页并保持页码
- 多项式加减法(递减排序)
- 淘宝Fourinone和Hadoop的完整对比