第一步:写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. Linux 升级修改libc gcc 文件名称,导致执行命令失效问题解决

    升级linux文件时,若不小心把文件名给重命名了,结果导致执行所有命令都不识别. 比如我们不小心执行了 mv /lib64/libc.so.6 /lib64/libc.so.6.bak 结果导致所有系 ...

  2. 微信小程序-WXSS

    WXSS(WeiXin Style Sheets)是一套样式语言,用于描述 WXML 的组件样式. WXSS 用来决定 WXML 的组件应该怎么显示. 为了适应广大的前端开发者,我们的 WXSS 具有 ...

  3. [原]简易android反编译教程

    1.apktool d -f <.apk> <output> 反编译出资源文件(及smali)2.使用winrar打开apk,提取出classed.dex,执行 d2j-dex ...

  4. 高级java必会系列二:多线程经常使用的3个关键字:synchronized、ReentrantLock、volatile

    系列一讲解了多线程,本章讲解多线程开发中经常使用到的3个关键字synchronized.ReentrantLock.volatile. 一.synchronized 互斥锁,即操作互斥,并发线程过来, ...

  5. Linux下查看某进程相关进程

    1- ps -T <pid> ###pid表示进程号 或者ps -T -p <pid> 2-   top -H -p <pid>  ###pid表示进程号 3-  ...

  6. iOS计算完整文字高度(适应iOS 10)

    动态计算文字的高度:(切记LineSapcing>=2,不然会显示不全) +(CGSize) boundingALLRectWithSize:(NSString*) txt Font:(UIFo ...

  7. nginx 客户端不缓存header

    location ~* \.(html|htm)$ { add_header Cache-Control no-store; }

  8. Linux(ubanto):可以ping通IP,但不能ping通域名

    打开/etc/resolv.conf文件 vi /etc/resolv.conf 插入一下两行保存即可 nameserver 8.8.8.8 nameserver 8.8.4.4

  9. Andorid项目创建AVD时,OK按钮无法点亮

    经上网查证,发现原因在于CPU/ABI选项无法选择,并显示“No system images installed for this target”,也就是没有适合的系统镜像,通过与安装好了的ADT-b ...

  10. Hive:org.apache.hadoop.hdfs.protocol.NSQuotaExceededException: The NameSpace quota (directories and files) of directory /mydir is exceeded: quota=100000 file count=100001

    集群中遇到了文件个数超出限制的错误: 0)昨天晚上spark 任务突然抛出了异常:org.apache.hadoop.hdfs.protocol.NSQuotaExceededException: T ...