DOM高级技巧

innerText与innerTHML的区别。innerHTML内容包括子标签的文本自内，而innerText的内容仅包含文本不含子标签

Code	innerText	innerHTML
<div>Hello world</div>	“Hello world”	“Hello world”
<div><b>Hello</b> world</div>	“Hello world”	“<b>Hello</b> world”
<div><span></span></div>	“”	“<span></span>”

outerText与outerHTML的区别，outerText仅包含当前标签内的文本，outerHTML包含当前标签以及其子标签在内的所有文本。（仅IE和Opera支持）

Code	outerText	outerHTML
<div>Hello world</div>	“Hello world”	“<div>Hello world</div>”
<div><b>Hello</b> world</div>	“Hello world”	“<div><b>Hello</b> world</div>”
<div><span></span></div>	“”	“<div><span></span></div>”

< html >
< head >
< title > OuterText Example </ title >
< style  type =”text/css” > ...
div.special {...}{
background-color: red;
padding: 10px;
}
</ style >
< script  type =”text/javascript” > ...
function useOuterText() ...{
var oDiv = document.getElementById(“div1”);
oDiv.outerText = oDiv.outerText;
alert(document.getElementById(“div1”));
}
</ script >
</ head >
< body >
< div  id =”div1”  class =”special” > This is my original text </ div >
< input  type =”button”  value =”Use  OuterText” onclick =”useOuterText()”  />
</ body >
</ html >