javascript小练习—点击将DIV变成红色（通过for循环遍历）
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>点击将DIV变成红色</title>
<style>
body{font:12px/1.5 Tahoma;text-align:center;}
code,input,button{font-family:inherit;}
#div{width: 1000px;height: 240px;position: relative;}
#div div{width: 200px;height: 200px;background-color: black;position: relative;float: left;margin: 10px;}
button{cursor:pointer;}
</style>
<script>
window.onload = function(){
var oDiv = document.getElementById("div").getElementsByTagName("div");
var oButton = document.getElementsByTagName("button")[0];
oButton.onclick = function(){
for(var i = 0;i<oDiv.length;i++){
oDiv[i].style.backgroundColor = "red";
}
};
};
</script>
</head>
<body>
<div id="div">
<div></div>
<div></div>
<div></div>
</div>
<p><button>点击将DIV变成红色</button></p>
</body>
</html>
javascript小练习—点击将DIV变成红色（通过for循环遍历）的更多相关文章
- javascript小练习—记住密码提示框
px/px solid redpxpx]; var oTips = document.getElementById("tips"); oP.onmousemove = functi ...
- 用循环将三个DIV变成红色
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- javascript小技巧(非常全)
事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放 event.srcElement.setCapture(); event.srcE ...
- JavaScript小实例：拖拽应用（二）
经常在网站别人的网站的注册页中看到一个拖拽验证的效果,就是它的验证码刚开始不出来,而是有一个拖拽的条,你必须将这个拖拽条拖到底,验证码才出来,说了感觉跟没说一样,你还是不理解,好吧,我给个图你看看: ...
- (网页)javascript小技巧(非常全)
事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放 event.srcElement.setCapture(); event.srcE ...
- JavaScript小练习2-网页换肤
题目 分析 三个皮肤切换按钮的选择 用li即可. 点击显示白点 li中嵌套一个li,onclick时改变子元素li的css onload 当页面加载完成后立即执行一段JavaScript代码. onl ...
- 点击一个div隐藏另一个div
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 如何设计点击点击一个div，其他div做出对应反应，以及获取一个节点下的子节点
<div id="show"> <div>1</div> <div>2</div> <div>3</d ...
- javascript学习代码--点击按钮显示内容
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- sqlserver事务与回滚
如果要在Production执行数据改动必须小心,可以使用事务提前验证一下自己写的SQL是不是你期望的.尤其是Update的where 条件有问题的话,跟新的记录就会超出预期的范围.如下面的语句,一着 ...
- Swift 3.0第1步，面向所有开发者开源
在移动开发中,Android开发一直比较受欢迎的原因之一就是其是一个开源的,有很多开源项目.代码可以用,这也是很多iOS开发者羡慕不已的地方.但值得庆贺的是,随着swift编程语言的发展,北京时间12 ...
- C/C++中的far和near两个指针
Dos 的设计是基于16位的CPU的,也就是CPU中的每个寄存器(Register)只有16位,只能存放0-65535(64K)的值.为了能访问大于64K的内存,人们用了分段的方法,用两个16位的数来 ...
- 编写程序输入一个5x5的矩阵,将最大元素与中心元素交换,并按行列对齐输出。
编写程序输入一个5x5的矩阵,将最大元素与中心元素交换,并按行列对齐输出. 题目描述 编写程序输入一个5x5的矩阵,将最大元素与中心元素交换,并按行列对齐输出. 输入描述 编写程序输入一个5x5的矩阵 ...
- Cmd批处理语法实例
@echo on :循环获取指定目录下以php为后缀的文件,且重命名后缀为html :for /r "E:\aaa\web" %%v in (*.php) do ren " ...
- flush privileges是什么意思？
flush privileges 命令本质上的作用是将当前user和privilige表中的用户信息/权限设置从mysql库(MySQL数据库的内置库)中提取到内存里.MySQL用户数据和权限有修改后 ...
- str系列---字符串函数
1. strcat extern char *strcat(char *dest,char *src); 把src所指字符串添加到dest结尾处(覆盖dest结尾处的'\0')并添加'\0'. 返回指 ...
- 基本数据结构简介--ath9k网卡驱动开发总结（二）
ath9k驱动代码主要数据结构概览. (1)在ath9k的驱动中,几乎是最顶层的数据结构是ath_softc,这个数据结构几乎随处可见.ath_softc是硬件与MAC层进行交互的中间载体,很多有用的 ...
- Oracle EBS-SQL (SYS-6):sys_在线用户职责查询.sql
/*线用户查询-1*/ SELECT FSAV.USER_NAME,FU.DESCRIPTION,FSAV.RESPONSIBILITY_NAME,FSAV.USER_FORM_NAME,FSAV.L ...
- CentOS7 vs centos6
The CentOS Project has announced general availability of CentOS-7, the first release of the free Lin ...