原生javascript实现隔行换色


Posted in Javascript onJanuary 04, 2015

js让我们一起从基础来学习,我们一点一点的来学习

下边是我写的代码,然后大家看着学习下吧!!!

<html>

<head>

<title>js演示</title>

</head>

<body>

<script>

document.write('<table border="1" width="100px" align="center">');

var i=0;

while(i<100){

if(i%10==0){

if(i%20==0)

bg="#cccccc";

else

bg="#ffffff";

document.write('<tr onmouseover="show(this)" onmouseout="onshow(this)" bgcolor="'+bg+'">');

}

document.write('<td>'+i+'</td>');

i++;

if(i%10==0){

document.write("<tr>");

}

}

document.write("</table>")

var ys=null;

function show(obj){

ys=obj.bgColor;

obj.bgColor="red";

}

function onshow(obj){

obj.bgColor=ys;

}

</script>

</body>

</html>

功能很简单,却非常实用,小伙伴们参考下吧。

Javascript 相关文章推荐
使用jquery插件实现图片延迟加载技术详细说明
Mar 12 Javascript
jquery 实现两Select 标签项互调示例代码
Sep 25 Javascript
JavaScript实现Iterator模式实例分析
Jun 09 Javascript
jquery+html5时钟特效代码分享(可设置闹钟并且语音提醒)
Mar 30 Javascript
JQUERY的AJAX请求缓存里的数据问题处理
Feb 23 Javascript
H5用户注册表单页 注册模态框!
Sep 17 Javascript
JS实现购物车特效
Feb 02 Javascript
JS实现商品橱窗特效
Jan 09 Javascript
阿望教你用vue写扫雷小游戏
Jan 20 Javascript
Node.js中文件系统fs模块的使用及常用接口
Mar 06 Javascript
vue webpack build资源相对路径的问题及解决方法
Jun 04 Javascript
vue动态设置路由权限的主要思路
Jan 13 Vue.js
jQuery中:reset选择器用法实例
Jan 04 #Javascript
浅谈 javascript 事件处理
Jan 04 #Javascript
jquery实现可拖拽弹出层特效
Jan 04 #Javascript
jQuery中:image选择器用法实例
Jan 03 #Javascript
jQuery中:submit选择器用法实例
Jan 03 #Javascript
jQuery中:checkbox选择器用法实例
Jan 03 #Javascript
jQuery中:radio选择器用法实例
Jan 03 #Javascript
You might like
PHP 文件上传全攻略
2010/04/28 PHP
php读取XML的常见方法实例总结
2017/04/25 PHP
thinkphp5使用无限极分类
2019/02/18 PHP
基于Jquery的标签智能验证实现代码
2010/12/27 Javascript
css结合js制作下拉菜单示例代码
2014/02/27 Javascript
jquery比较简洁的软键盘特效实现方法
2015/03/19 Javascript
jQuery 利用$.ajax 时获取原生XMLHttpRequest 对象的方法
2016/08/25 Javascript
基于JS+Canves实现点击按钮水波纹效果
2016/09/15 Javascript
vue-router 导航钩子的具体使用方法
2017/08/31 Javascript
微信小程序用户自定义模版用法实例分析
2017/11/28 Javascript
JS中使用textPath实现线条上的文字
2017/12/25 Javascript
讲解vue-router之什么是嵌套路由
2018/05/28 Javascript
vue中如何实现pdf文件预览的方法
2018/07/12 Javascript
webstrom Debug 调试vue项目的方法步骤
2018/07/17 Javascript
Vue和React组件之间的传值方式详解
2019/01/31 Javascript
如何自动化部署项目?折腾服务器之旅~
2019/04/16 Javascript
vue下使用nginx刷新页面404的问题解决
2019/08/02 Javascript
vue实现文件上传读取及下载功能
2020/11/17 Javascript
Javascript中的奇葩知识,你知道吗?
2021/01/25 Javascript
Python文件夹与文件的相关操作(推荐)
2016/07/25 Python
Python实现定时自动关闭的tkinter窗口方法
2019/02/16 Python
如何使用scrapy中的ItemLoader提取数据
2020/09/30 Python
HTML5 用动画的表现形式装载图像
2016/03/08 HTML / CSS
中国酒类在线零售网站:酒仙网
2016/08/20 全球购物
倩碧澳大利亚官网:Clinique澳大利亚
2019/07/22 全球购物
简历的自我评价范文
2014/02/04 职场文书
干部现实表现材料
2014/02/13 职场文书
《老王》教学反思
2014/02/23 职场文书
环保公益策划方案
2014/08/15 职场文书
关于感恩的演讲稿800字
2014/08/26 职场文书
离职证明标准格式
2014/09/15 职场文书
2014年客服工作总结与计划
2014/12/09 职场文书
普宁寺导游词
2015/02/04 职场文书
新人入职感言
2015/07/31 职场文书
Python中文纠错的简单实现
2021/07/07 Python
nginx之内存池的实现
2022/06/28 Servers