IE的DHTML对象提供了四个可读写的属性来动态操作页面元素的内容:innerText, outerText, innerHTML, outerHTML.
需注意两点:
1. 其中innerText,outerText属性的值是作为普通文本呈现的，即使它含有HTML标签也如实反应出来;而innerHTML, outerHTML呈现的是经HTML引擎解析后文本，它可以反应属性中HTML标签的表现效果。
2. 对对象的outerText，outerHTML属性赋值(即写操作)会删除该对象。
以上四个属性的赋值操作只是替换原对象的文本内容，想要在页面中指定元素相关位置新增文本内容，需采用insertAdjacentHTML和insertAdjacentText方法。形式如下:
object.insertAdjacentText(sWhere, sText)
object.insertAdjacentHTML(sWhere, sText)
其中 sWhere 表示插入的文本相对于html标签的位置，有如下四个预设值:
beforeBegin，afterBegin，beforeEnd，afterEnd
使用中需注意如下几点:
1.这两种方法必须在整个文档装载完成之后才能使用，否则将出错。
2. InsertAdjacentText只能插入普通文本，InsertAdjacentHTML插入html格式的文本
3. 用InsertAdjacentHTML插入脚本，必须在script元素中使用defer属性，否则脚本执行将出现运行期错误
4.InsertAdjacentHTML插入html元素后，all以及其他可能的元素集合将自动更新以反应动态变化。如页面后续元素的sourceIndex 属性将改变。
5.当赋予InsertHTML/outerHTML属性无效的HTML标签，该方法可能出现运行时错。如以下代码将出错:
<BODY>
<p id=pdiv></p>
<SCRIPT LANGUAGE="javascript">
pdiv.innerHTML = "<p>hello</p>"
</SCRIPT>
</BODY>
此外页面内容动态操作还需要注意如下一些细节:
1.只有文档BODY内显示的内容能被以上属性和方法动态改变，BODY对象的内容能被动态操作，但BODY对象本身无法被替换。
2.以上属性和方式不能操作空标签(没有内容的html标签)，如input,img。
3.对于table对象而言，只有td(innerHTML/innerText)和table(outerHMTL/outerText)对象可以用某些属性来替换或插入内容;而其他table对象，如tr、tbody不能用这些属性来改变内容。
添加HTML内容与文本内容以前用的是innerHTML与innerText方法，最近发现还有insertAdjacentHTML和 insertAdjacentText方法，这两个方法更灵活，可以在指定的地方插入html内容和文本内容。insertAdjacentHTML方法：在指定的地方插入html标签语句原型：insertAdajcentHTML(swhere,stext)参数：swhere: 指定插入html标签语句的地方，有四种值可用：1. beforeBegin: 插入到标签开始前2. afterBegin:插入到标签开始标记之后3. beforeEnd:插入到标签结束标记前4. afterEnd:插入到标签结束标记后stext：要插入的内容
<html><head><script language="Javascript">function myfun(){var obj = document.getElementByIdx_x_x("btn1");obj.insertAdjacentHTML("afterEnd","<br><inputname=/"txt1/">");}</script></head><body><input name="txt"><input id="btn1" name="btn1" type="button"value="更多..." onclick="myfun()"></body></html>＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
<head><title>24.htminsertAdjacentHTML插入新内容</title><script language="jscript">function addsome(){document.all.paral.insertAdjacentHTML("afterBegin","<h1>在文本前容器内插入内容</h1>");document.all.paral.insertAdjacentHTML("beforeEnd","<h2>在文本后容器内插入内容</h2>");document.all.paral.insertAdjacentHTML("beforeBegin","<h4>在文本前容器外插入内容</h1>");document.all.paral.insertAdjacentHTML("afterEnd","<h5>在文本后容器外插入内容</h2>");}</script></head><body onload="addsome()"><div id="paral"style="fontsize:6;color=’#ff00ff’">原来的内容</div><hr></body></html>＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0Transitional//EN"><HTML><HEAD><TITLE> New Document</TITLE><META NAME="Generator"CONTENT="EditPlus"><META NAME="Author" CONTENT=""><META NAME="KeyWords"CONTENT=""><META NAME="Description"CONTENT=""></HEAD><BODY><script>var num=0;var No_sys=0;function Add_button(){if(No_sys<8){c_input.insertAdjacentHTML("beforeEnd","<divid=/"bar"+num+"/" oncontextmenu=/"Remove_button(bar"+num+");returnfalse/"style=/"background:red;width:40;height:20/">"+num+"</div>");num++;No_sys++;}}function Remove_button(obj){obj.removeNode(true);No_sys--;}</script><input type="button" onclick="Add_button()"value="动态加"><input type="button"onclick="alert(c_input.innerHTML)" value="看"><div id="c_input"></div></BODY></HTML>用法：<div id="test"><spanstyle="color:red">test1</span>test2</div>在JS中可以使用：test.innerHTML: 也就是从对象的起始位置到终止位置的全部内容,包括Html标签。 上例中的test.innerHTML的值也就是“<spanstyle="color:red">test1</span>test2 ”。test.innerText: 从起始位置到终止位置的内容, 但它去除Html标签 上例中的text.innerTest的值也就是“test1 test2”, 其中span标签去除了。test.outerHTML: 除了包含innerHTML的全部内容外, 还包含对象标签本身。 上例中的text.outerHTML的值也就是<divid="test"><spanstyle="color:red">test1</span>test2</div>完整示例：<div id="test"><spanstyle="color:red">test1</span>test2</div><ahref="javascript:alert(test.innerHTML)">innerHTML内容</a><ahref="javascript:alert(test.innerText)">inerHTML内容</a><ahref="javascript:alert(test.outerHTML)">outerHTML内容</a>特别说明： innerHTML是符合W3C标准的属性，而innerText只适用于IE浏览器，因此，尽可能地去使用innerHTML，而少用innerText，如果要输出不含HTML标签的内容，可以使用innerHTML取得包含HTML标签的内容后，再用正则表达式去除HTML标签，下面是一个简单的符合W3C标准的示例：<ahref="javascript:alert(document.getElementByIdx_x_x('test').innerHTML.replace(/<.+?>/gim,''))">无HTML,符合W3C标准</a>新闻热点
疑难解答
