• 前者:看见与不看见,但是位置保留。
• 后者处理与位置有关:block, inline, none 分别是有前后换行,不换行,不显示功能但是不保留位置。
• 二者功能差异:保留位置,和位置形式
<script language="javascript">
function toggleVisibility(me)
{
if(me.style.visibility=="hidden")
{
me.style.visibility="visible";
}
else
{
me.style.visibility="hidden";
}
}
</script>
<DIV onclick="toggleVisibility(this)"
style="position:relative">
第一行文本将会触发"hidden"和"visible"属性,注意第二行的变化。
</DIV>
<DIV>因为visibility会保留元素的位置,所以第二行不会移动.</DIV>
<script language="javascript">
function toggleDisplay(me){
if(me.style.display=="block"){
me.style.display="inline";
alert("文本现在是:'inline'.");
}
else{
if(me.style.display=="inline"){
me.style.display="none";
alert("文本现在是:'none'.3秒钟后自动重新显示。");
window.setTimeout("blueText.style.display='block';",
3000,"javascript");
}
else{
me.style.display="block";
alert("文本现在是:'block'.");
}
}
}
</script>
<DIV>在<span id="blueText"
onclick="toggleDisplay(this)"
style="color:blue;position:relative;cursor:hand;">
蓝色</span>文字上点击来查看效果.</DIV>