这是一个点击“red”或“blue”会改变下面背景颜色的代码
我想问,为啥在IE7下面不起效果??
如何才能在IE7底下运行实现该效果?<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
.red{
background-color:#e71401;
}
.blue{
background-color:#1ca1d9;
}
.c11{
width:100px;
height:100px;
background-color:purple;
}
.c1{
width:100px;
height:100px;
}
.c21{
width:100px;
height:100px;
background-color:yellow;
}
.c2{
width:100px;
height:100px;
}
.c31{
width:100px;
height:100px;
background-color:green;
}
.c3{
width:100px;
height:100px;
}
</style><script language="javascript" type="text/javascript">
var theColors = new Array();
function changeColors(name){
theColors = document.getElementsByName("bgc");
for (var i=0;i<theColors.length;i++)
{
x = theColors[i].className;
if(x.substring(0,2)=="c1") {alert("c1 "+ name);theColors[i].className = "c1 " + name; }
if(x.substring(0,2)=="c2") theColors[i].className = "c2 " + name;
if(x.substring(0,2)=="c3") theColors[i].className = "c3 " + name;
}
}
</script>
</head><body><div style="width:50px; height:50px;" onclick="changeColors('red');">red</div>
<div style="width:50px; height:50px;" onclick="changeColors('blue');">blue</div><div class="c11">
<div name="bgc" class="c1">
111
</div>
</div><div class="c21">
<div name="bgc" class="c2">
222
</div>
</div><div class="c31">
<div name="bgc" class="c3">
333
</div>
</div></body>
</html>
我想问,为啥在IE7下面不起效果??
如何才能在IE7底下运行实现该效果?<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
.red{
background-color:#e71401;
}
.blue{
background-color:#1ca1d9;
}
.c11{
width:100px;
height:100px;
background-color:purple;
}
.c1{
width:100px;
height:100px;
}
.c21{
width:100px;
height:100px;
background-color:yellow;
}
.c2{
width:100px;
height:100px;
}
.c31{
width:100px;
height:100px;
background-color:green;
}
.c3{
width:100px;
height:100px;
}
</style><script language="javascript" type="text/javascript">
var theColors = new Array();
function changeColors(name){
theColors = document.getElementsByName("bgc");
for (var i=0;i<theColors.length;i++)
{
x = theColors[i].className;
if(x.substring(0,2)=="c1") {alert("c1 "+ name);theColors[i].className = "c1 " + name; }
if(x.substring(0,2)=="c2") theColors[i].className = "c2 " + name;
if(x.substring(0,2)=="c3") theColors[i].className = "c3 " + name;
}
}
</script>
</head><body><div style="width:50px; height:50px;" onclick="changeColors('red');">red</div>
<div style="width:50px; height:50px;" onclick="changeColors('blue');">blue</div><div class="c11">
<div name="bgc" class="c1">
111
</div>
</div><div class="c21">
<div name="bgc" class="c2">
222
</div>
</div><div class="c31">
<div name="bgc" class="c3">
333
</div>
</div></body>
</html>
解决方案 »
- ajax search api的使用,请高手指点!
- 关于JavaScript的prototype和instanceof
- ExtJS关于icon图标不显示的问题?
- 在jsp页面中,怎样根据读取数据库的速度设置easyui进度条的进度
- JS获取页面doctype,有木有大侠知道,并且可以兼容IE,firefox的
- 为什么我用创建的子元素都没产生在对应的父元素下?
- window.open的问题,急,在线等!
- 怎么验证EMAIL地址是否正确?
- 如何在netscape中实现在页面制定的地方显示制定的内容
- 求助,大师帮忙把这段JS解密。
- 关于extjs treepanel的一些问题
- 显示图片,添加一个遮罩层,背景变灰半透明状态,点击两次遮罩层就变成全灰不透明了
A, APPLET, BUTTON, FORM, FRAME, IFRAME, IMG, INPUT, OBJECT, MAP, META, PARAM, TEXTAREA, SELECT所以说,IE7其实是符合规范的,你可以改为用getElementsByTagName获取指定标签的元素再用name或class属性过滤的方法
的div换成a?