無。
Firefox 不支持 DOM 對象的 insertAdjacentHTML insertAdjacentText 方法。
使用這兩個方法將在 Firefox 瀏覽器內(nèi)報錯。
Firefox |
---|
insertAdjacentHTML 方法是比 innerHTML、outerHTML 屬性更靈活的插入 HTML 代碼的方法。它可以實現(xiàn)在一個 DOM 元素的前面、后面、第一個子元素前面、最后一個子元素后面四個位置,插入指定的 HTML 代碼。不是 W3C 標(biāo)準(zhǔn)的 DOM 方法。
這個方法最初是由 IE4.0 以上版本實現(xiàn),為私有特性。詳細(xì)內(nèi)容請參見 MSDN 說明:insertAdjacentHTML Method。
W3C 近期在 HTML5 草案中擴展了這個方法,更多詳細(xì)的信息,請參見 W3C HTML5 草案:3.5.7 insertAdjacentHTML()。
目前,主瀏覽器中,只有 Firefox 不支持 insertAdjacentHTML 方法。
<script type="text/javascript">window.onload = function() {var ps = document.getElementById("one");try {ps.insertAdjacentHTML("beforeend", "<span style='background:yellow;'>hi</span>");} catch(err) {document.getElementById("info").innerHTML = err;}}</script><p id="one" style="background:silver; width:300px;">this is<i style="width:100px; background-color:gold;">another</i>text</p><div id="info"></div>
測試用例中,頁面加載的時候,會執(zhí)行 one 的 insertAdjacentHTML方法。
如果執(zhí)行期間有JS錯誤,錯誤信息會在 info 中輸出。
如果執(zhí)行成功,one 元素內(nèi)容的最后會被加上一個有黃色背景的文本“hi”。
在各瀏覽器下的截圖:
Firefox | IE6 IE7 IE8 Chrome Safari Opera |
---|---|
![]() | ![]() |
可見,只有 Firefox 下不支持 insertAdjacentHTML 方法。
insertAdjacentText 是比 innerText、outerText 屬性更靈活的插入文本的方法。它可以實現(xiàn)在一個 DOM 元素的前面、后面、第一個子元素前面、最后一個子元素后面四個位置,插入指定的文本。不是 W3C 標(biāo)準(zhǔn)的 DOM 方法。
這個方法是 IE 私有特性。詳細(xì)內(nèi)容請參見 MSDN 說明:insertAdjacentText Method。
至今為止 W3C 的 HTML5 草案還未涉及此方法。
目前,主瀏覽器中,只有 Firefox 不支持 insertAdjacentText 方法。
<script type="text/javascript">window.onload = function() {var ps = document.getElementById("one");try {ps.insertAdjacentText("beforeend", "<span style='background:yellow;'>hi</span>");} catch(err) {document.getElementById("info").innerHTML = err;}}</script><p id="one" style="background:silver; width:300px;">this is<i style="width:100px; background-color:gold;">another</i>text</p><div id="info"></div>
如果執(zhí)行成功,one 元素內(nèi)容的最后會被加上文本 “<span style='background:yellow;'>hi</span>”。
在各瀏覽器下的截圖:
Firefox | IE6 IE7 IE8 Chrome Safari Opera |
---|---|
![]() | ![]() |
可見,只有 Firefox 下不支持 insertAdjacentText 方法。
在 Firefox 中,可通過擴展 HTMLElement 的原型 (prototype) 來實現(xiàn)這兩個方法:
if (typeof(HTMLElement) != "undefined") {HTMLElement.prototype.insertAdjacentElement = function(where, parsedNode) {switch (where) {case "beforeBegin":this.parentNode.insertBefore(parsedNode, this);break;case "afterBegin":this.insertBefore(parsedNode, this.firstChild);break;case "beforeEnd":this.appendChild(parsedNode);break;case "afterEnd":if (this.nextSibling)this.parentNode.insertBefore(parsedNode, this.nextSibling);elsethis.parentNode.appendChild(parsedNode);break;}}HTMLElement.prototype.insertAdjacentHTML = function(where, htmlStr) {var r = this.ownerDocument.createRange();r.setStartBefore(this);var parsedHTML = r.createContextualFragment(htmlStr);this.insertAdjacentElement(where, parsedHTML);}HTMLElement.prototype.insertAdjacentText = function(where, txtStr) {var parsedText = document.createTextNode(txtStr);this.insertAdjacentElement(where, parsedText);}}
操作系統(tǒng)版本: | Windows 7 Ultimate build 7600 |
---|---|
瀏覽器版本: | IE6 IE7 IE8 Firefox 3.6.8 Chrome 6.0.472.11 dev Safari 5.0.1 Opera 10.60 |
測試頁面: | insertAdjacentHTML.html insertAdjacentText.html |