<style>
*{
margin: 0;
padding: 0;
}
#div1 {
display: none;
}
#div1 li {
width: 100px;
height: 40px;
background-color: pink;
}
</style>
</head>
<body>
<input type="button" value="更多" onclick="showHide()">
<div id="div1">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</div>
<script>
function showHide() {
var oDiv = document.getElementById('div1');
if(oDiv.style.display === 'none'){
oDiv.style.display = 'block';
} else {
oDiv.style.display = 'none';
}
}
</script>
</body>
第一次点击隐藏的div并没显示出来,需要点击第二次才显示。这是什么原因造成的??