1、從基本開始
原始碼:
<a onclick="javascript:document.getElementById('test').style.display=none">點擊隱藏ID為test的DIV</a>
<div id="test" style="border: 1px solid rgb(238, 238, 238); padding: 5px;">這是一段測試文字</div>
示範效果:
點擊隱藏ID為test的DIV
這是一段測試文字
這是一個最基本的例子，因為只可以點擊隱藏。注意名為test的DIV的初始顯示內容(display)是none，也就是隱藏；而連結<a>裡點擊(onclick)之後該DIV的顯示內容display='',是將DIV的顯示設定為預設（顯示）
2、加上條件判斷來控制顯示
如果您有許可權編輯您的blog模板，那麼可以在head間插入如下的js代碼
<script type="text/javascript">
function discontrol(itemid){
if(document.getElementById(itemid).style.display=='none'){
document.getElementById(itemid).style.display="";
}
else{
document.getElementById(itemid).style.display="none";
}
}
</script>
代碼的意思為，當id為itemid的DIV顯示為“隱藏/none”時，重設其顯示為“顯示”；而當其他狀況下，設定其顯示為"隱藏/none"
當你新寫日誌的時候，只需要在代碼編輯環境下將要顯示或隱藏的DIV設定ID名，然後在控制DIV顯示與隱藏的連結上按如下格式書寫即可:
<a onclick="divcontrol('DIV的ID')" style="cursor:pointer">連結名稱</a>
記得將你的DIV命名ID
