jquery replaceWith無法在谷歌瀏覽器上工作

我在使用Google Chrome瀏覽器中的javascript動態替換控件時遇到了一個奇怪的問題。替換的控件不顯示在用戶界面中，但是當我使用開發人員工具時，我可以找到替換的元素，但直到關閉開發人員工具後才顯示出來。一旦我打開並關閉開發人員工具，問題不再可複製，直到我刷新頁面。jquery replaceWith無法在谷歌瀏覽器上工作

只有在我試圖替換元素的outerHTML的情況下才會發生這種情況。

我第一次使用jquery's replaceWith API嘗試，即力的幫助，所以我切換到下面的腳本 -

function chromeOuterHTML(oldElem, outerhtml) 
{ 
var el = document.createElement('div'); 
el.innerHTML = outerhtml; 
var parentNode = oldElem.parentNode; 
var range = document.createRange(); 
     range.selectNodeContents(el); 
     var documentFragment = range.extractContents(); 
     parentNode.insertBefore(documentFragment, oldElem); 
     parentNode.removeChild(oldElem); 
}

我不認爲它與因爲這個問題我的JavaScript的一個問題是針對Chrome，也發生在只有某些情況。

任何幫助，將不勝感激

來源

2012-01-23 Vinay B R

如果您可以發佈指向示例頁面的鏈接，您一定會更快獲得解決方案！ – Beejamin

其他一些想法：範圍是有趣的野獸 - 它們可以跨越開始點和結束點之間的幾個元素，因此它們不一定會乾淨地選擇DOM節點。你的情況不會成爲問題，但你永遠不知道。 – Beejamin

我在處理具有多個頂級節點的documentFragments時也看到了奇怪的行爲。我不記得具體細節，但是我發現當片段包含在單個頂級節點中時，它們的表現會更好。 – Beejamin

超過溶液中的診斷工具，但你有沒有試過延緩你的insertBefore？

function chromeOuterHTML(oldElem, outerhtml) 
{ 
var el = document.createElement('div'); 
el.innerHTML = outerhtml; 
var parentNode = oldElem.parentNode; 
var range = document.createRange(); 
     range.selectNodeContents(el); 
     var documentFragment = range.extractContents(); 
      setTimeout(function() {  
       parentNode.insertBefore(documentFragment, oldElem); 
       parentNode.removeChild(oldElem); 
    }, 1); 
}

在某些情況下（我不完全理解），如果DOM操作發生太快而連續發生，則可能會失敗。此修改將延遲（僅1毫秒）插入 - 這可能會有所作爲。它也可能無能爲力！

來源

2012-01-23 21:28:43 Beejamin

這個變化沒有幫助:(。 –

jquery replaceWith無法在谷歌瀏覽器上工作

回答

相關問題