注意jquery文件的路径要正确.

<!DOCTYPE html>

<html>

<head>

    <title></title>

    <meta charset="UTF-8" />

    <script type="text/javascript" src="jquery-3.2.1.js"></script>

    <style type="text/css">

        td{

            width: 200px;

            height: 30px;

            float: left;

            align: center;

            padding-left: 100px;

        }

    </style>

</head>

<body>

    <table align="center">

        <tr><td>只是第一行.</td></tr>

        <tr><td>只是第二行.</td></tr>

        <tr><td>只是第三行.</td></tr>

        <tr><td>只是第四行.</td></tr>

    </table>

</body>

<script type="text/javascript">

var time = setInterval(neonLights, 1000);

var flag = 0;

$('table').css("align", 'center');

function  neonLights(){

    if (flag % 2 == 0) {

            $("tr:even").css("background", '#2579BF');

            $("td:even").get(0).innerHTML = "RGB = #2579BF";

            $("td:even").get(1).innerHTML = "RGB = #2579BF";

            $("tr:odd").css("background", '#FB9752');

            $("td:odd").get(0).innerHTML = "RGB = #FB9752";

            $("td:odd").get(1).innerHTML = "RGB = #FB9752";

    }

    else{

            $("tr:even").css("background", '#FB9752');

            $("td:even").get(0).innerHTML = "RGB = #FB9752";

            $("td:even").get(1).innerHTML = "RGB = #FB9752";

            $("tr:odd").css("background", '#2579BF');

            $("td:odd").get(0).innerHTML = "RGB = #2579BF";

            $("td:odd").get(1).innerHTML = "RGB = #2579BF";

    }

    flag++;

}

</script>

</html>

这就完成了, 其实可以和前面一篇随机色的联系起来, 会更有意思.

JQuery和js实现简单的霓虹灯的更多相关文章

  1. jquery.validate.js的简单示例

    一.官方资料 官网 github 二.html <!DOCTYPE html> <html> <head> <meta charset="utf-8 ...

  2. jquery.validate.js 表单验证简单用法

    引入jquery.validate.js插件以及Jquery,在最后加上这个插件的方法名来引用.$('form').validate(); <!DOCTYPE html PUBLIC " ...

  3. jQuery.template.js 简单使用

    之前看了一篇文章<我们为什么要尝试前后端分离>,深有同感,并有了下面的评论: 我最近也和前端同事在讨论这个问题,比如有时候前端写好页面给后端了,然后后端把这些页面拆分成很多的 views, ...

  4. jQuery懒加载插件 – jquery.lazyload.js简单调用

    Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...

  5. jquery.base64.js简单使用

    jquery.base64.js, 加密,使用,先引入jquery,然后引入jquery.base64.js 使用如下 js中加密如下 $.base64.encode(result[i].ipadre ...

  6. jquery.query.js 插件（示例及简单应用）

    帮助文档 var url = location.search; > "?action=view&section=info&id=123&debug&te ...

  7. jquery.cycle.js简单用法实例

    样式: a{text-decoration: none;} *{;;} /*容器设置*/ .player { width:216px; height:248px; background:url(htt ...

  8. jquery.query.js 插件（示例及简单应用） —— html之间传值

    帮助文档 var url = location.search; > "?action=view&section=info&id=123&debug&te ...

  9. 一个简单的页面弹窗插件 jquery.pageMsgFrame.js

    页面弹窗是网站中常用的交互效果,它可以强提示网站的某些信息给用户,或者作用于某些信息的修改等等功能. 这几天在做一个项目的时候,就顺捎把这个插件写一下,栽棵树,自己乘凉吧. 原创博文,转载请注明出处: ...

随机推荐

  1. Python爬虫要学什么？写给小白的Python爬虫必备技能

    Python在爬虫方面用得比较多,所以你如果能掌握以下内容,找工作的时候就会顺利很多: 1.爬虫,不是抓取到数据就完事了,如果有数据抽取.清洗.消重等方面经验,也是加分项; 2.大部分的公司都要求爬虫 ...

  2. JVM学习-运行时数据区域

    目录 前言 运行时数据区 程序计数器 Java虚拟机栈 局部变量表 基础数据类型 对象引用 returnAddress 操作数栈 动态链接 方法返回地址 Java堆 方法区 类型信息 字段描述符 方法 ...

  3. (15)-Python3之--configparser模块

    1.模块简介 configparser模块是python用来读取配置文件的模块,置文件的格式跟windows下的ini或conf配置文件相似,可以包含一个或多个节(section), 每个节可以有多个 ...

  4. jQuery 页面滚动 吸顶 和 吸底

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

  5. 第一个 Maven 应用程序

    概述 使用 Maven 创建一个 Java Web 应用程序 创建 Maven 项目 选择 File -> New -> Project... 选择 Maven 项目 填写项目信息 选择工 ...

  6. 静电、浪涌与TVS

    ESD和浪涌问题往往是基带工程师最头疼的问题,因为测试标准严苛,问题神出鬼没.特别是ESD问题,没有解决问题的标准路径,只能靠反复地构思方案并验证.想要尽量避免以上问题,就必须选择合适的防护器件,设计 ...

  7. JDBC的操作步骤和实例（）

    加载JDBC驱动程序 提供JDBC连接的URL 创建数据库的连接 创建一个Statement 执行SQL语句 处理结果 关闭JDBC对象 实例JdbcUtils 创建一个JDBC程序包含7个步骤: 1 ...

  8. Centos搭建spark

    Centos搭建spark 一.spark介绍 二.spark安装前提 三.集群规划 四.spark安装 五.修改spark环境变量 六.修改spark-env.sh 七.修改slaves 八.将安装 ...

  9. C语言--指针数组大小

    #include <stdio.h> #include <string.h> int main(void) { char *str[3]={ "Hello,thisi ...

  10. 6. Linux输入输出重定向

    1.输入重定向是指把文件导入到命令中,而输出重定向则是指把原本要输出到屏幕的数据信息写入到指定文件中. 输入重定向中用到的符号及其作用 输出重定向中用到的符号及其作用 1)通过输出重定向将原本要输出到 ...