一般把script放在body的最下方就可以獲取到body里的元素了，可是我做的這個選項卡效果把script放在body的最下面了，可是去掉window.onload之后，效果就出不來了，這是怎么回事<!DOCTYPE?html>
<html>
<head>
????<meta?charset="UTF-8">
????<title>Title</title>
????<style>
????????*{
????????????margin:0;
????????????padding:0;
????????????list-style-type:?none;
????????}
????????#container{
????????????width:400px;
????????????height:250px;
????????????position:?relative;
????????}
????????#top?li{
????????????width:100px;
????????????height:50px;
????????????float:?left;
????????}
????????#bottom?li{
????????????width:400px;
????????????height:200px;
????????????position:?absolute;
????????????left:0;
????????????top:50px;
????????????display:?none;
????????}
????????.first{
????????????background:?red;
????????}
????????.second{
????????????background:?blue;
????????}
????????.third{
????????????background:?purple;
????????}
????????.four{
????????????background:?pink;
????????}
????????#bottom?li.first{
????????????display:?block;
????????}
????</style>
</head>
<body>
<div?id="container">
????<ul?id="top">
????????<li></li>
????????<li></li>
????????<li></li>
????????<li></li>
????</ul>
????<ul?id="bottom">
????????<li></li>
????????<li></li>
????????<li></li>
????????<li></li>
????</ul>
</div>
<script>
????window.onload=?function?()?{
????????var?top?=?document.getElementById("top"),
????????????top_li?=?top.getElementsByTagName("li"),
????????????bottom?=?document.getElementById("bottom"),
????????????bottom_li?=?bottom.getElementsByTagName("li");
????????for?(var?i?=?0;?i<top_li.length;i++){
????????????top_li[i].index?=?i;
????????????top_li[i].onclick?=?function(){
????????????????for?(var?j?=?0;j<bottom_li.length;j++){
????????????????????bottom_li[j].style.display?=?"none";
????????????????}
????????????????bottom_li[this.index].style.display?=?"block";
????????????};
????????}
????}
</script>
</body>
</html>
關于window.onload的問題
qq_煙火里的塵埃_0
2016-08-18 10:17:37
