                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /JavaScript进阶篇

为什么这样写选项卡的内容一闪就过了，然后一直显示第一个选项卡的内容？

<!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">
body{
	margin:0 auto;
	padding:0 10px;
	width:400px;
}
.clear{
	clear:both;
}
#list{
	width:90%;
	height:38px;
}
ul{
	list-style:none;
}
li{
	width:70px;
	float:left;
	padding:5px;
	margin:5px 40px 0 -35px;
	border:1px solid #69F;
	border-bottom:none;
	text-align:center;
}
a{
	text-decoration:none;
}
#content{
	border:1px solid  #69F;
	padding:0 10px;
	width:100%;
	border-top:#C03 2px solid;
}
p{
	width:auto;
	margin-right:70px;
}
.hide{
	display:none;
}
.show{
	display:block;
}

</style>
</head>

<body>
<div id="list">
<ul>
    <li><a href="" name="p1" >房产</a></li>
    <li><a href="" name="p2" >家居</a></li>
    <li><a href="" name="p3" >二手房</a></li>
</ul>
<div class="clear"></div>
</div>
<div id="content">
<p id="p1">
    275万购昌平邻铁三居 总价20万买一居
    200万内购五环三居 140万安家东三环
    北京首现零首付楼盘 53万购东5环50平
    京楼盘直降5000 中信府 公园楼王现房
</p>

<p id="p2" class="hide">
     40平出租屋大改造 美少女的混搭小窝
     经典清新简欧爱家 90平老房焕发新生
     新中式的酷色温情 66平撞色活泼家居
     瓷砖就像选好老婆 卫生间烟道的设计
</p>
<p id="p3" class="hide">
     通州豪华3居260万 二环稀缺2居250w甩
     西3环通透2居290万 130万2居限量抢购
     黄城根小学学区仅260万 121平70万抛!
     独家别墅280万 苏州桥2居优惠价248万
</p>
</div>
<script type="text/javascript">
function showCont(){
	var list = document.getElementsByTagName("a");
	for(var i=0;i<list.length;i++){
		list[i].onmouseover=function(){
			this.parentNode.style.borderTop="2px solid #C03";
		}
		list[i].onmouseout=function(){
			this.parentNode.style.borderTop="1px solid #69F"
		}
		list[i].onclick=function(){
			var para = document.getElementsByTagName("p");
			for(var j=0;j<para.length;j++){
				if(para[j].getAttribute("id")!=this.getAttribute("name")){
					para[j].className="hide";
				}else{
					para[j].className="show";
				}
			}
		}
	}
}
window.onload=showCont;
</script>
</body>
</html>