jquery 交替为表格添加样式的代码
下面就是我的“作品”啊,只是简单的实现其功能,并未做其他的功能啊
运行后,需要刷新下, 上面得代码比较简单,更多的例子,可以搜索我们以前发布的文章。
表头 | 表头 | 表头 |
---|---|---|
我们 | jb51.net | 4561263 |
123456 | 789879 | 4561263 |
123456 | 789879 | 4561263 |
123456 | 789879 | 4561263 |
123456 | 789879 | 4561263 |
123456 | 789879 | 4561263 |
123456 | 789879 | 4561263 |
123456 | 789879 | 4561263 |
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
相关推荐
-
jQuery 选择表格(table)里的行和列及改变简单样式
jQuery对表格(table)的处理提供了相当强大的功能,比如说对表格特定行(row)或列(column)进行排序.样式改变等等.如果你的英文够好,你可以读读这篇文章:jQuery table manipulation.本文只是介绍如何用jQuery语句对表格中行和列进行选择以及一些简单样式改变,希望它可以对jQuery表格处理的深层学习提供一些帮助. 比如我们有这样一个表格: 第一列 第二列 第三列 第四列 第一列 第二列 第三列 第四列 第一列 第二列 第三列 第四列 第一列 第二列 第三
-
基于Jquery的表格隔行换色,移动换色,点击换色插件
效果图:编写JQUERY插件如下: 复制代码 代码如下: ;(function($) { $.fn.extend({ "alterBgColor":function(options){ //设置默认值 option=$.extend({ odd:"odd", even:"even", selected:"selected" },options); //注意这个options 同上面的function(options)中的opt
-
jquery自定义表格样式
本文实例讲述了jquery自定义表格样式实现代码.分享给大家供大家参考.具体如下: 运行效果截图如下: 上面这张图有3种状态,默认状态(灰白相间),鼠标悬浮状态(绿色),鼠标点击状态(黄色),是如何实现的呐? Html代码如下: <table> <thead> <tr> <td>编号</td> <td>姓名</td> <td>年龄</td> <td>操作</td> </
-
jQuery表格行上移下移和置顶的实现方法
我们在操作列表数据的时候,需要将数据行排列顺序进行调整,如上移和下移行,将行数据置顶等,这些操作都可以在前端通过点击按钮来完成,并且伴随着简单的动态效果,轻松实现表格数据排序. 运行效果图: HTML 页面上是一个简单的数据表格,我们在数据行中分别放置"上移","下移"和"置顶"三个链接,并且分别定义三个class属性,我们来通过jQuery实现这些操作. <table class="table"> <tr&
-
JQuery操作表格(隔行着色,高亮显示,筛选数据)
查了些资料,写了4个Demo: 1. 隔行着色 复制代码 代码如下: $('#table1 tr:odd').addClass('odd'); $('#table1 tr:even').addClass('even'); 效果: 2. 高亮含有特定数据的行 复制代码 代码如下: $("#table2 tr:contains('Fuck')").addClass("selected"); 3. 筛选数据 复制代码 代码如下: $("#filter"
-
jQuery 表格隔行变色代码[修正注释版]
复制代码 代码如下: <!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=&qu
-
jquery实现表格奇数偶数行不同样式(有图为证及实现代码)
非侵入实现,控制更方便 效果图: 复制代码 代码如下: <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>javascript practice</title> <script type="text/javascript" src="jq
-
jQuery实现表格颜色交替显示的方法
本文实例讲述了jQuery实现表格颜色交替显示的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <!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/xhtm
-
jquery实现表格隔行换色效果
本文实例讲述了jquery实现表格隔行换色效果的代码.分享给大家供大家参考.具体如下: 运行效果截图如下: 具体代码如下: 1.新建一个web项目,jQuery: 2.在WebContent目录下新建script文件夹,将jquery-1.10.1.js复制到script中: 3.同样,新建TableColor.html: TableColor.html: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
-
javascript基于jQuery的表格悬停变色/恢复,表格点击变色/恢复,点击行选Checkbox
// 版本: 1.0 // 日期: 2007/08/01 // 备注: 需要jQuery库 // 参考: Dodo(tableRowCheckboxToggle) 和 softcomplex(tigra_tables) function Kin_Tables( Kin_Table_GetTableMethod, //得到Table的方法 同$()功能 必选参数 Kin_Table_Header_Offset, //从
-
用JQuery实现表格隔行变色和突出显示当前行的代码
复制代码 代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> &l
随机推荐
- Perl与JS的对比分析(数组、哈希)
- JavaScript的正则也有单行模式了
- Asp.Net 程序错误Runtime Error原因与解决
- Javascript之面向对象--方法
- nginx上传文件大小报错500的解决办法
- 为什么在重写 equals方法的同时必须重写 hashcode方法
- urllib2自定义opener详解
- 详谈js中数组(array)和对象(object)的区别
- 解析android中系统日期时间的获取
- python中global用法实例分析
- 深入分析C中不安全的sprintf与strcpy
- C#基础之匿名方法实例教程
- 详解JavaScript节流函数中的Throttle
- nodejs通过phantomjs实现下载网页
- Iframe自适应高度兼容ie,firefox多浏览器
- vue基于Element构建自定义树的示例代码
- ajax XMLHTTP Post Form时的表单乱码综合解决
- Raphael带文本标签可拖动的图形实现代码
- 微信小程序 条件渲染详解
- 详解spring boot整合JMS(ActiveMQ实现)