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 学习笔记(一)DOM基本操作
Apr 08 Javascript
jquery.ajax的url中传递中文乱码问题的解决方法
Feb 07 Javascript
基于jQuery实现复选框的全选 全不选 反选功能
Nov 24 Javascript
JavaScript如何自定义trim方法
Jul 28 Javascript
JS实现可展开折叠层的鼠标拖曳效果
Oct 09 Javascript
今天抽时间给大家整理jquery和ajax的相关知识
Nov 17 Javascript
小心!AngularJS结合RequireJS做文件合并压缩的那些坑
Jan 09 Javascript
Node.js文件操作方法汇总
Mar 22 Javascript
Javascript之图片的延迟加载的实例详解
Jul 24 Javascript
Vue 父子组件的数据传递、修改和更新方法
Mar 01 Javascript
手把手教你使用TypeScript开发Node.js应用
May 06 Javascript
JS 设计模式之:单例模式定义与实现方法浅析
May 06 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
[原创]ThinkPHP中SHOW_RUN_TIME不能正常显示运行时间的解决方法
2015/10/10 PHP
PHP写的简单数字验证码实例
2017/05/23 PHP
PHP如何获取当前主机、域名、网址、路径、端口等参数
2017/06/09 PHP
php实现微信公众平台发红包功能
2018/06/14 PHP
PHP面向对象类型约束用法分析
2019/06/12 PHP
JavaScript 解析读取XML文档 实例代码
2009/07/07 Javascript
CSS(js)限制页面显示的文本字符长度
2012/12/27 Javascript
解析js原生方法创建表格效率测试
2013/07/08 Javascript
js动态创建、删除表格示例代码
2013/08/07 Javascript
JS匀速运动演示示例代码
2013/11/26 Javascript
js的hasownproperty使用示例
2014/03/02 Javascript
如何使用Bootstrap的modal组件自定义alert,confirm和modal对话框
2016/03/01 Javascript
纯JS前端实现分页代码
2016/06/21 Javascript
.net MVC+Bootstrap下使用localResizeIMG上传图片
2017/04/21 Javascript
JavaScript字符串检索字符的方法
2017/06/23 Javascript
JavaScript简单实现关键字文本搜索高亮显示功能示例
2018/07/25 Javascript
详解ECMAScript2019/ES10新属性
2019/12/06 Javascript
详解ES6实现类的私有变量的几种写法
2021/02/10 Javascript
[52:37]完美世界DOTA2联赛循环赛 Forest vs DM BO2第一场 10.29
2020/10/29 DOTA
Python3实现生成随机密码的方法
2014/08/23 Python
python复制与引用用法分析
2015/04/08 Python
python返回昨天日期的方法
2015/05/13 Python
Python中的with...as用法介绍
2015/05/28 Python
利用python求解物理学中的双弹簧质能系统详解
2017/09/29 Python
对numpy中数组元素的统一赋值实例
2018/04/04 Python
使用tensorflow显示pb模型的所有网络结点方式
2020/01/23 Python
html5 视频播放解决方案
2016/11/06 HTML / CSS
美国领先的商务贺卡出版商:The Gallery Collection
2018/02/13 全球购物
爱尔兰电子产品购物网站:Komplett.ie
2018/04/04 全球购物
2014年青年志愿者工作总结
2014/12/09 职场文书
焦裕禄纪念馆观后感
2015/06/09 职场文书
清明扫墓感想
2015/08/11 职场文书
python munch库的使用解析
2021/05/25 Python
springboot + mongodb 通过经纬度坐标匹配平面区域的方法
2021/11/01 MongoDB
一文了解MySQL二级索引的查询过程
2022/02/24 MySQL
三种方式清除vue路由跳转router-link的历史记录
2022/04/10 Vue.js