在html页面中遇到js控制“显示、隐藏”页面元素时的方法,先贴上代码:
<html> <body> <div id= "divID" style= "display:inline"> 测试 </div> <input type=button value= "显示" onclick='document.getElementById("divID").style.display="inline"'> <input type=button value= "隐藏" onclick='document.getElementById("divID").style.display="none"'> </body> </html>
注意,这里使用display属性的inline,而不用block,是因为在html描述中:
block:此元素将显示为块级元素,此元素前后会带有换行符。
inline:默认。此元素会被显示为内联元素,元素前后没有换行符。
即使用block会出现换行。代码:
<html> <body> <div id= "divID" style= "display:block"> 测试 </div> <input type=button value= "显示" onclick='document.getElementById("divID").style.display="block"'> <input type=button value= "隐藏" onclick='document.getElementById("divID").style.display="none"'> </body> </html>