6个DIV 135或246间隔一秒轮番显示效果


Posted in Javascript onJuly 24, 2010

在某技术群看到 A君 提出的如下一个问题:

A君

6个DIV 间隔一秒 轮番进行奇偶显示. 比如先135 一秒后 246 然后再135 循环

A君

要求代码短小精悍

B君

var a = document.getElementsByTagName('div'); 
var b = false; 
setInterval(function() { 
for (var i = 0; i < 6; i++) 
a[i].style.display = ((i & 1) ^ b) ? 'block' : 'none'; 
b = !b; }, 1000);

A君
D君这个效率不错啊
我这个不如abcd的简洁

j++; for (var i = 0; i < 6; i++) o[i].style.display = [['block', 'none'], ['none', 'block']][j & 1][i & 1];

D君
用数组,也影响效率

看完不得感叹 D君 的方法真的很好,如果是我真的想不出如此高效率的方法。

Javascript 相关文章推荐
javascript 事件处理示例分享
Dec 31 Javascript
Angular中的Promise对象($q介绍)
Mar 03 Javascript
使用jQuery给input标签设置默认值
Jun 20 Javascript
vue.js+boostrap项目实践(案例详解)
Sep 21 Javascript
jQuery删除当前节点元素
Dec 07 Javascript
解析Vue2.0双向绑定实现原理
Feb 23 Javascript
详解微信小程序 相对定位和绝对定位
May 11 Javascript
微信小程序使用Promise简化回调
Feb 06 Javascript
解决循环中setTimeout执行顺序的问题
Jun 20 Javascript
node.js实现http服务器与浏览器之间的内容缓存操作示例
Feb 11 Javascript
Vue页面手动刷新,实现导航栏激活项还原到初始状态
Aug 06 Javascript
基于vue中的scoped坑点解说
Sep 04 Javascript
js获取元素在浏览器中的绝对位置
Jul 24 #Javascript
几个有趣的Javascript Hack
Jul 24 #Javascript
用jquery实现等比例缩放图片效果插件
Jul 24 #Javascript
js ondocumentready onmouseover onclick onmouseout 样式
Jul 22 #Javascript
javascript基础第一章 JavaScript与用户端
Jul 22 #Javascript
aspx中利用js实现确认删除代码
Jul 22 #Javascript
JS实现self的resend
Jul 22 #Javascript
You might like
基于php设计模式中单例模式的应用分析
2013/05/15 PHP
一个简单安全的PHP验证码类、PHP验证码
2016/09/24 PHP
Html中JS脚本执行顺序简单举例说明
2010/06/19 Javascript
javascript 使用 NodeList需要注意的问题
2013/03/04 Javascript
javascript操作css属性
2013/12/30 Javascript
JavaScript Math.ceil 方法(对数值向上取整)
2015/01/09 Javascript
JS实现跟随鼠标闪烁转动色块的方法
2015/02/26 Javascript
JS+CSS实现美化的下拉列表框效果
2015/08/11 Javascript
WEB前端开发都应知道的jquery小技巧及jquery三个简写
2015/11/15 Javascript
javascript实现标签切换代码示例
2016/05/22 Javascript
DataTables+BootStrap组合使用Ajax来获取数据并且动态加载dom的方法(排序,过滤,分页等)
2016/11/09 Javascript
JavaScript实现提交模式窗口后刷新父窗口数据的方法
2017/06/16 Javascript
微信小程序实现图片放大预览功能
2020/10/22 Javascript
JavaScript继承与多继承实例分析
2018/05/26 Javascript
element-ui 上传图片后清空图片显示的实例
2018/09/04 Javascript
Koa日志中间件封装开发详解
2019/03/09 Javascript
4 种滚动吸顶实现方式的比较
2019/04/09 Javascript
JavaScript工具库之Lodash详解
2019/06/15 Javascript
vue 集成jTopo 处理方法
2019/08/07 Javascript
微信小程序实现同时上传多张图片
2020/02/03 Javascript
iview实现图片上传功能
2020/06/29 Javascript
仅用50行代码实现一个Python编写的计算器的教程
2015/04/17 Python
在python中将字符串转为json对象并取值的方法
2018/12/31 Python
python 利用pandas将arff文件转csv文件的方法
2019/02/12 Python
Python之time模块的时间戳,时间字符串格式化与转换方法(13位时间戳)
2019/08/12 Python
解决python 3 urllib 没有 urlencode 属性的问题
2019/08/22 Python
Tensorflow之梯度裁剪的实现示例
2020/03/08 Python
使用Python将xmind脑图转成excel用例的实现代码(一)
2020/10/12 Python
EGO Shoes美国/加拿大:英国时髦鞋类品牌
2018/08/04 全球购物
正宗的澳大利亚Ugg靴子零售商:UGG Express
2020/04/19 全球购物
中软Java笔试题
2012/11/11 面试题
房地产销售员的自我评价分享
2013/12/04 职场文书
安全保证书范文
2014/04/29 职场文书
岗位说明书怎么写
2014/07/30 职场文书
党员个人公开承诺书
2014/08/29 职场文书
十八大标语口号
2014/10/09 职场文书