insertAdjacentHTML和 insertAdjacentText這兩個方法很靈活，可以在指定的地方插入html內容和文本內容，在大部分情況下比element.innerHTML的性能更好，比Document Fragments更好的HTML文檔插入方案，因為我們知道Document Fragments在某些IE版本中的表現不好。

insertAdjacentText方法與 insertAdjacentHTML方法類似，只不過只能插入純文本，參數相同。

insertAdjacentHTML和insertAdjacentText方法：

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標簽語句

.insertadjacenthtml()方法具體怎么使用?

原型：insertAdajcentHTML(swhere,stext)

Element.insertAdjacentHTML方法解析HTML字符串，然后將生成的節點插入DOM樹的指定位置。

element.insertAdjacentHTML(position, text);

該方法接受兩個參數，第一個是指定位置，第二個是待解析的字符串。

參數：

swhere: 指定插入html標簽語句的地方，有四種值可用：

1. beforeBegin: 插入到標簽開始前

2. afterBegin:插入到標簽開始標記之后

3. beforeEnd:插入到標簽結束標記前

4. afterEnd:插入到標簽結束標記后

// 原來的HTML代碼： div id= one one /div var d1 = document.getElementById( one d1.insertAdjacentHTML( afterend , div id= two two /div // 現在的HTML代碼：// div id= one one /div div id= two two /div 

注意：該方法不是徹底置換現有的DOM結構，這使得它的執行速度比innerHTML操作快得多。

stext：要插入的內容

 html  head  script language= javascript function myfun()var obj = document.getElementById( btn1 obj.insertAdjacentHTML( afterEnd , br input name=/ txt1/  /script  /head  body  input name= txt  input id= btn1 name= btn1 type= button value= 更多... quot;myfun()  /body  /html 

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝

 head  title 24.htm insertAdjacentHTML插入新內容 /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 >
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
 !DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.0 Transitional//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 , div id=/ bar +num+ / oncontextmenu=/ Remove_button(bar +num+ return false/ >
用法：
 div id= test  span >
在JS中可以使用：
test.innerHTML:
也就是從對象的起始位置到終止位置的全部內容,包括Html標簽。 
上例中的test.innerHTML的值也就是
“ span >
test.innerText:
從起始位置到終止位置的內容, 但它去除Html標簽 
上例中的text.innerTest的值也就是“test1 test2”, 其中span標簽去除了。 
test.outerHTML:
除了包含innerHTML的全部內容外, 還包含對象標簽本身。
上例中的text.outerHTML的值也就是
 div id= test span >
完整示例：
 div id= test  span >
特別說明：
innerHTML是符合W3C標準的屬性，而innerText只適用于IE瀏覽器，因此，盡可能地去使用innerHTML，而少用innerText，如果要輸出不含HTML標簽的內容，可以使用innerHTML取得包含HTML標簽的內容后，再用正則表達式去除HTML標簽，下面是一個簡單的符合W3C標準的示例：
 a href= javascript:alert(document.getElementById( test ).innerHTML.replace(/ .+? /gim, )) 無HTML,符合W3C標準 /a 
以上就是.insertadjacenthtml()方法怎么使用?的詳細內容，html教程        
鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。