为什么单独一个的时候能正常隐藏，加多一个之后，第一个就不会隐藏了？
<html>
<head>
<style>
.tab{
border:1px solid #f00;
width:400px;
height:100px;
background:#f60;
margin:auto;
padding:0px;
overflow:hidden;
position:relative;
left:0px;
top:0px
margin-bottom:30px;
}
.tbb{
border:1px solid #f00;
width:400px;
height:200px;
background:#360;
margin:auto;
padding:0px;
overflow:hidden;
position:relative;
left:0px;
top:0px
}
</style>
<script>
H=400;
W=400;
id='timing_hidden'
function show_con(){
var obj_nav=document.getElementById(id)
var n=20,t=50;
var timers=new Array(n);
for(var i=0;i<n;i++){(
function(){
if(timers[i]) clearTimeout(timers[i]);
var j=i;
timers[i]=setTimeout(function(){
obj_nav.style.display="none";
},(i+1)*t);
}
)()};
}
setTimeout("show_con()",6000);
H=400;
W=400;
id='timi_hidd'
function showb_con(){
var bbb_bav=document.getElementById(id)
var n=20,t=50;
var btimer=new Array(n);
for(var i=0;i<n;i++){(
function(){
if(btimer[i]) clearTimeout(btimer[i]);
var j=i;
btimer[i]=setTimeout(function(){
bbb_bav.style.display="none";
},(i+1)*t);
}
)()};
}
setTimeout("showb_con()",6000);
</script>
</head>
<body>
<div id='timing_hidden' class='tab'> 提示：6秒钟后这个层自动隐藏，可自定义时间。 </div> <!--第一个-->
<div id='timi_hidd' class='tbb'> 提示：6秒钟后这个层自动隐藏，可自定义时间。 </div> <!--加多一个-->
</body>
</html>
按照你的代码，问题在于变量名id赋值了两次，后一次的覆盖了前一次的，所以前一个div根本没取到，隐藏不生效，不想改代码结构的话，改一下变量名就可以了，如下：
<html>
<head>
<style>
.tab {
border: 1px solid #f00;
width: 400px;
height: 100px;
background: #f60;
margin: auto;
padding: 0px;
overflow: hidden;
position: relative;
left: 0px;
top: 0px margin-bottom:30px;
}
.tbb {
border: 1px solid #f00;
width: 400px;
height: 200px;
background: #360;
margin: auto;
padding: 0px;
overflow: hidden;
position: relative;
left: 0px;
top: 0px
}
</style>
<script>
H = 400;
W = 400;
id = 'timing_hidden'
function show_con() {
var obj_nav = document.getElementById(id)
var n = 20, t = 50;
var timers = new Array(n);
for (var i = 0; i < n; i++) {
(
function () {
if (timers[i]) clearTimeout(timers[i]);
var j = i;
timers[i] = setTimeout(function () {
obj_nav.style.display = "none";
}, (i + 1) * t);
}
)()
};
}
setTimeout("show_con()", 3000);
H = 400;
W = 400;
bid = 'timi_hidd' //修改变量名
function showb_con() {
var bbb_bav = document.getElementById(bid)
var n = 20, t = 50;
var btimer = new Array(n);
for (var i = 0; i < n; i++) {
(
function () {
if (btimer[i]) clearTimeout(btimer[i]);
var j = i;
btimer[i] = setTimeout(function () {
bbb_bav.style.display = "none";
}, (i + 1) * t);
}
)()
};
}
setTimeout("showb_con()", 3000);
</script>
</head>
<body>
<div id='timing_hidden' class='tab'> 提示：6秒钟后这个层自动隐藏，可自定义时间。 timing_hidden</div>
<!--第一个-->
<div id='timi_hidd' class='tbb'> 提示：6秒钟后这个层自动隐藏，可自定义时间。timi_hidd </div>
<!--加多一个-->
</body>
</html>
1..tab样式里top:0后面少个分号
2.一个可以运行，两个不可以是因为后面的覆盖前面的了。你会发现，你随意注释掉一个都可以正常运行。
3.其实可以封装成一个函数。统一调用就可以（可以参考下面）
<html>
<head>
<style>
.tab {
border: 1px solid #f00;
width: 400px;
height: 100px;
background: #f60;
margin: auto;
padding: 0px;
overflow: hidden;
position: relative;
left: 0px;
top: 0px;
margin-bottom:30px;
}
.tbb {
border: 1px solid #f00;
width: 400px;
height: 200px;
background: #360;
margin: auto;
padding: 0px;
overflow: hidden;
position: relative;
left: 0px;
top: 0px
}
</style>
<script>
// H = 400;
// W = 400;
// id = 'timing_hidden'
function show_con(H,W,id) {
var obj_nav = document.getElementById(id)
var n = 20, t = 50;
var timers = new Array(n);
for (var i = 0; i < n; i++) {
(
function () {
if (timers[i]) clearTimeout(timers[i]);
var j = i;
timers[i] = setTimeout(function () {
obj_nav.style.display = "none";
}, (i + 1) * t);
}
)()
};
}
setTimeout(()=>{
show_con(400,400,'timing_hidden');
show_con(400,400,'timi_hidd');
}, 6000);
// H = 400;
// W = 400;
// id = 'timi_hidd'
// function showb_con() {
// var bbb_bav = document.getElementById(id)
// var n = 20, t = 50;
// var btimer = new Array(n);
// for (var i = 0; i < n; i++) {
// (
// function () {
// if (btimer[i]) clearTimeout(btimer[i]);
// var j = i;
// btimer[i] = setTimeout(function () {
// bbb_bav.style.display = "none";
// }, (i + 1) * t);
// }
// )()
// };
// }
// setTimeout("showb_con()", 6000);
</script>
</head>
<body>
<div id='timing_hidden' class='tab'> 提示：6秒钟后这个层自动隐藏，可自定义时间。 </div>
<!--第一个-->
<div id='timi_hidd' class='tbb'> 提示：6秒钟后这个层自动隐藏，可自定义时间。 </div>
<!--加多一个-->
</body>
</html>
仅仅为了隐藏那这样就可以了
<script>
function show_con(){
document.getElementById("timing_hidden").style.display="none";
}
function showb_con(){
document.getElementById("timi_hidd").style.display="none";
}
setTimeout(function () {
show_con();
showb_con();
},6000);
</script>