當輸入爲html內容時返回DOM的Javascript函數

我想要一個當輸入爲HTML內容時返回正確DOM的Javascript函數。我已經使用了相同的功能。這裏輸入的是HTML內容，輸出是DOM。當輸入爲html內容時返回DOM的Javascript函數

function htmltoelement(elementHTML) 
{ 
    var temDiv = document.createElement('div'); 
    temDiv.innerHTML = elementHTML;   
    return temDiv; 
}

此功能適用於Firefox，但不適用於IE瀏覽器或Chrome瀏覽器，當HTML損壞時。

我需要一個可以在所有瀏覽器上正常工作的功能的建議，即使HTML被破壞了。

來源

2010-07-29 Dora

你能否澄清一下「即使HTML被破壞」？你的意思是輸入本身不是有效的HTML？ – 2010-07-29 12:44:44

你爲什麼期望它能夠處理破碎的HTML？ – James 2010-07-29 12:46:22

@ J-P - 我認爲OP *可能意味着他們的印象是'.innerHTML'被破壞而不是輸入，我認爲這有點含糊/需要澄清。 – 2010-07-29 12:50:05

使用「破損的」HTML（我假設它是無效的），它的解釋方式主要取決於瀏覽器和瀏覽器所處的模式。頂部的DOCTYPE將決定如何解析innerHTML屬性當它被設置。對於XHTML，它會給你一些奇怪的結果，因爲「破碎的」HTML會讓你的整個頁面變得混亂。您使用的功能是正確的，但您似乎需要在嘗試創建div之前檢查輸入是否符合規定。

來源

2010-07-29 12:53:45

嘿，我同意你的看法，輸入由用戶這裏給出，所以我不能限制用戶插入唯一正確的HTML。即使HTML不正確，我也需要一個可以正常工作的函數。 – Dora 2010-07-30 06:11:38

@Dora - 真的沒有一個，你餵養一個程序無效的輸入，輸出將是不可預知的，*非常*不一致的跨瀏覽器。 – 2010-07-30 10:21:58

你可以寫出來，以一個隱藏的iframe實現這一目標：

<iframe id="frame" style="display:none"></iframe> 
<script type="text/javascript"> 

function htmltoelement(elementHTML) 
{ 
    var temp = document.getElementById('frame'); 

    // Cross-browser way to get the iframe document 
    var idoc = (temp.contentWindow || temp.contentDocument); 
    if (idoc && idoc.document) idoc = idoc.document; 

    // Put the HTML in the iframe 
    idoc.write("<html><body>" + elementHTML + "</body></html>"); 
    temDiv = document.createElement('div'); 
    temDiv.innerHTML = idoc.body.innerHTML; 

    return temDiv; 
} 

document.body.appendChild(htmltoelement('<b><i>hi</b></i>')); 

</script>

隱藏的iframe似乎是必要的，使用document.createElement（「IFRAME」）沒有在Opera工作。

來源

2010-07-29 13:46:36

當輸入爲html內容時返回DOM的Javascript函數

回答

相關問題