<button onClick="rshow()">随机显示下一个</button>
<div id=show_id></div>
<script type=text/javascript>
var udata=new Array('这是第一笔资料，这里面可以使用任何HTML代码',
'这是第一笔资料，这里面可以使用任何HTML代码',
'这是第二笔资料，这里面可以使用任何HTML代码',
'这是第三笔资料，这里面可以使用任何HTML代码',
'这是第十笔资料，这里面可以使用任何HTML代码')
function rshow(){
show_id.innerText=udata[Math.floor(Math.random()*udata.length)]
}
rshow()
</script>
写了个简单的：<!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/htmlcharset=utf-8" />
<title>by 阿会楠 - 给我一双翅膀，我也将展翅高飞</title>
<script language="javascript" type="text/javascript">
function changebg(n){
return function(){
var lis = document.getElementById("lis").getElementsByTagName("li")
for(var k=0k<lis.lengthk++){
lis[k].style.backgroundColor="white"
}
for(var j=0j <lis.lengthj++){
if(lis[j].getAttribute("id")=="class_"+(n+1)){
lis[j].style.backgroundColor="blue"
}
}
}
}
window.onload = function(){
var menus = document.getElementById("menu").getElementsByTagName("div")
for(var i=0i<menus.lengthi++){
menus[i].onclick=changebg(i)
}
}
</script>
</head>
<body>
<div id="menu">
<div>分类1</div>
<div>分类2</div>
<div>分类3</div>
</div>
<div id="lis">
<li id='class_1'>分类1</li>
<li id='class_1'>分类1</li>
<li id='class_2'>分类2</li>
<li id='class_2'>分类2</li>
<li id='class_3'>分类3</li>
<li id='class_3'>分类3</li>
<li id='class_3'>分类3</li>
</div>
</body>
</html>
<!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" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=UTF-8">
<title>Document</title>
<script type="text/javascript">
function myadd(obj,e,fn){
if(obj.attachEvent){
obj.attachEvent("on"+e, fn)
}else{
obj.addEventListener(e,fn,false)
}
}
myadd(window, 'load',function(){
var box1 = document.getElementById("box1")
var close = document.getElementById("close")
var nr = document.getElementById("nr")
var i = 0
var shuzu = [
'哈哈你被整了！1',
'哈哈你被整了！2',
'哈哈你被整了！3',
'哈哈你被整了！4',
'哈哈你被整了！5',
'哈哈你被整了！6',
'哈哈你被整了！7',
'哈哈你被整了！8',
'哈哈你被整了！9',
'哈哈你被整了！0','哈哈你被整了！1',
'哈哈你被整了！2'
]
close.onclick = function(){
i++
if(i == 12){
i = 0
}
nr.innerHTML = shuzu[i]
box1.style.display = 'none'
window.setTimeout(function(){
box1.style.display = 'block'
},400)
}
})
</script>
</head>
<style type="text/css">
.box1{
background:#ccc
width:200px
margin:200px auto
}
.bgs{
position:fixed
top: 0px
left: 0px
background:rgba(0,0,0,0.4)
width:100%
height: 100%
}
.box1 .close{
font-size: 18px
line-height:40px
background:red
color:white
cursor: pointer
}
</style>
<body>
<div class="bgs" id = 'box1'>
<div class="box1" >
<div class="close" id = 'close' style = 'text-align:ceter'>点我关闭吧 x</div>
<div class="nr" id= 'nr'>哈哈你被整了！</div>
</div>
</div>
</body>
</html>
