<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>
<div id="div4"></div>
<div id="div5"></div>
5个div每次只能有一个显示,js写,不要每次都document.getElementById,能不能把他们放到一个数组进行操作
<div id="div2"></div>
<div id="div3"></div>
<div id="div4"></div>
<div id="div5"></div>
5个div每次只能有一个显示,js写,不要每次都document.getElementById,能不能把他们放到一个数组进行操作
function getList(flag,n)
{
for(var i=0;i<n;i++)
{
divList.push(document.getElementById(flag+(i+1)));
}
}显示的时候传一个对应的下标function showIt(n)
{
for(var i=0;i<divList.length;i++)
{
divList[i].style.display=(n==i+1)? "block" : "none";
}
}
<div id="div2" name="test> </div>
<div id="div3" name="test> </div>
<div id="div4" name="test> </div>
<div id="div5" name="test> </div>
document.getElementsByName("test")[i]
返回一个数组 然后循环就行了
// 自己扩展下就可以了
<div id="div1">div1 </div>
<div id="div2">div2 </div>
<div id="div3">div3 </div>
<div id="div4">div4 </div>
<div id="div5">div5 </div> <script type="text/javascript">
<!--
var $ = function(){
for(var i = 0, elements = [], len = arguments.length; i < len; i++){
var element = arguments[i];
if(typeof element == 'string'){
element = document.getElementById(element);
}
if(arguments.length == 1){
return element;
}
elements.push(element);
}
return elements;
}window.onload = function(){
var odivs = $('div1', 'div2', 'div3', 'div4', 'div5');
for(var j = 0; j < odivs.length; j++){
alert(odivs[j].innerHTML)
}
}
//-->
</script>
变换层显示的,1秒换一个<!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>
<script src="js/jquery-1.3.2.min.js"></script>
<style type="text/css">
div
{
width:100px;
height:100px;
}
</style>
</head>
<body>
<table>
<tr>
<td>
<div id="div1" style="display:block; background-color:red">div1 </div>
<div id="div2" style="display:none; background-color:blue;">div2 </div>
<div id="div3" style="display:none; background-color:green;">div3 </div>
<div id="div4" style="display:none; background-color:#C03;"> div4</div>
<div id="div5" style="display:none; background-color:yellow;">div5</div>
</td>
</tr>
</table>
</body>
</html>
<script language="javascript">
$(function()
{
window.setInterval("showOne()",1000);
});
function showOne()
{
var last=parseInt($('div[id^=div]:last').attr("id").substring(3));
var index=Math.floor(Math.random()*last+1);//显示的图片的i
$('div[id^=div]').css("display","none");//先都设为不显示
$('div[id^=div]')[index-1].style.display="block";
}</script>
我是做项目的时候用到JavaScript,
这个页面左边一个导航,当点击某个链接的时候右边给显示相应的层