第一步:写html代码部分:

<table style="width:300px;">
<tr><td>1</td></tr>
<tr><td>2</td></tr>
<tr><td>3</td></tr>
<tr><td>4</td></tr>
<tr><td>5</td></tr>
<tr><td>6</td></tr>
<tr><td>7</td></tr>
<tr><td>8</td></tr>
<tr><td>9</td></tr>
</table>

第二步:插入jquery插件:

<script src="js/jquery-3.1.0.min.js"></script>

第三步:写jquery代码:

<script type="text/javascript">
$(document).ready(function(){
$("tr:nth-child(2n+1)").css("background","red");
$("tr:first-child").css("background","blue");
$("tr:last-child").css("background","green");

});
</script>

jquery做表格变色效果-demo的更多相关文章

  1. jQuery 实现表格变色效果

    html <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <ti ...

  2. 如何用Jquery做图片展示效果

    一. 前言 到底用JQuery做出怎样的展示效果? 让我们先来看一下!网页加载时,如图所示: 二.本人思路 这个效果初学者看起来好像有点复杂,其实不太难,关键是理清思路,从后端的数据库中找出我们要展示 ...

  3. Jquery表格变色 复选框全选,反选

    /*jquery静态表格变色*/ $(".tr2").mouseover(function(){ $(this).css("background"," ...

  4. JQuery实现隔行变色和突出显示当前行 效果

    运行效果如下图: jquery关键代码: <script type="text/javascript"> //该文件为:js.js // 当鼠标移到表格上是,当前一行背 ...

  5. 用JQuery实现表格隔行变色和突出显示当前行

    用JQuery实现表格隔行变色和突出显示当前行 上源码 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "htt ...

  6. 简单的用jQuery做遮罩效果

    <!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8" ...

  7. 基于jquery的表格动态创建,自动绑定,自动获取值

    最近刚加入GUT项目,学习了很多其他同事写的代码,感觉受益匪浅. 在GUT项目中,经常会碰到这样一个问题:动态生成表格,包括从数据库中读取数据,并绑定在表格中,以及从在页面上通过jQuery新增删除表 ...

  8. 推荐20款基于 jQuery & CSS 的文本效果插件

    jQuery 和 CSS 可以说是设计和开发行业的一次革命.这一切如此简单,快捷的一站式服务.jQuery 允许你在你的网页中添加一些真正令人惊叹的东西而不用付出很大的努力,要感谢那些优秀的 jQue ...

  9. jQuery实现模拟滚动条效果;

    滚动条在web开发中,很常见,原生的HTML滚动条很难看,因此很多网站借助JS来模拟实现滚动条效果: 滚动条的实现原理其实比较简单,拿垂直滚动条来说: 1),最外层容器需要设置overflow:hid ...

随机推荐

  1. C#代码

    http://www.cnblogs.com/zjfree/category/269738.html 超简易静态Web服务器 C# 生成不重复随机字符串 (1秒内生成1000000个) C# 读写IN ...

  2. React Native IOS源码初探

    原文链接 http://www.open-open.com/lib/view/open1465637638193.html 每个项目都有一个入口,然后进行初始化操作,React Native 也不例外 ...

  3. Uiautomator ——API详解(转载http://www.cnblogs.com/by-dream/p/4921701.html)

    转载来源: 简单的例子 以一个简单的例子开始吧.我们完成一个 " 打开QQ,进入QQ空间,然后退出 " 的case. 代码如下: package QQ; import java.i ...

  4. PorterDuffXfermode的用法

    1.下面的Xfermode子类可以改变这种行为: AvoidXfermode  指定了一个颜色和容差,强制Paint避免在它上面绘图(或者只在它上面绘图). PixelXorXfermode  当覆盖 ...

  5. 树状sql--采用递归方式获取节点

    创建数据库 create table City(id varchar(3) primary key , pid varchar(3) , name varchar(10)) 插入数据 insert i ...

  6. List转换成XML

    protected void Button1_Click(object sender, EventArgs e) { var customerlist = CustomerHelper.GetList ...

  7. MongoDB安装及入门

    下载 windows下的是3.2的版本 https://docs.mongodb.com/manual/tutorial/install-mongodb-on-windows/ mongodb采用27 ...

  8. 改造过的JS颜色选择器

    项目中用到颜色选择功能,在网上找了个颜色选择器,自己改了改代码.做成了一个可动态加载的颜色选择器. 把代码贴上,当是记录. /*Copyright(c)2009,www.supersite.me*/ ...

  9. C# 利用ICSharpCode.SharpZipLib实现在线加密压缩和解密解压缩

    这里我们选用ICSharpCode.SharpZipLib这个类库来实现我们的需求. 下载地址:http://icsharpcode.github.io/SharpZipLib/ 1.单个或多个文件加 ...

  10. Java绘图

    paintComponent(Graphics g)方法: 1.不调用super.paintComponent(g)的话,rePaint()的时候就会把你写的paintComponent中的内容绘制上 ...