本文向大家介紹一下對DIV的操作，主要針對DIV顯示和隱藏操作，希望本文的介紹能讓你有所收獲。

一.DIV顯示/隱藏

1.設(shè)置div顯示或隱藏

document.getElementById("div1").style.display="none";//DIV隱藏  
document.getElementById("div2").style.display="";  
//DIV顯示  

當(dāng)然也可以直接用如下方式顯示：

div1.style.display="none";//DIV隱藏  
div2.style.display="";//DIV顯示  
 

2.innerHTML,outerHTML,innerText,outerText

關(guān)于這四者的區(qū)別，網(wǎng)上有段經(jīng)典的代碼：

<dividdivid="div"> 
<inputnameinputname="button"value="Button"type="button"> 
<fontcolorfontcolor="green"> 
<h2>ThisisaDIV!</h2> 
</font> 
</div> 
<inputnameinputname="innerHTML"value="innerHTML"type="button" 
OnClick="alert(div.innerHTML);"> 
<inputnameinputname="outerHTML"value="outerHTML"type="button" 
OnClick="alert(div.outerHTML);"> 
<inputnameinputname="innerText"value="innerText"type="button" 
OnClick="alert(div.innerText);"> 
<inputnameinputname="outerText"value="outerText"type="button" 
OnClick="alert(div.outerText);"> 
 

 從中可以很清楚的看出四者各自的功能：

innerHTML:在div里面的html標(biāo)簽，通過它可以方便的設(shè)置div里要顯示的內(nèi)容，如：

document.getElementById("div3").innerHTML="<strong>hhh</strong>";

outerHTMl:包括div在內(nèi)的所有html標(biāo)簽

innerText:要在div里顯示的文本，和outerText基本一樣。

值得注意的是，以上四個只有innerHTML在firefox下有效，其他均只在IE下可用

【編輯推薦】

1. 探究IE7beta2的CSS兼容性
2. IE6、IE7、Firefox中margin問題解決辦法
3. DIV布局規(guī)范中CSS類及id命名方式
4. CSS兼容：解決IE6、IE7和IE8的兼容問題妙招
5. 將XHTML+CSS頁面轉(zhuǎn)換為打印機(jī)頁面技巧