在代碼段HTML中呈現xml和html標簽

Question

簡單地，如何使用<html>標簽呈現代碼片段

<div id="container">
   <div id="header_area"><tiles:insertAttribute name="header"  /></div>
   <div id="body_area"><tiles:insertAttribute name="body" /></div>
   <div id="sidebar_area"><tiles:insertAttribute name="sidebar" /></div>
   <div id="footer_area"><tiles:insertAttribute name="footer" /></div>
</div>

我找到了此代碼。但是它向所有/>添加了結尾標簽

function encodePreElements() {
    var pre = document.getElementsByTagName('pre');
    for(var i = 0; i < pre.length; i++) {
        var encoded = htmlEncode(pre[i].innerHTML);
        pre[i].innerHTML = encoded;
    }
};

function htmlEncode(value) {
   var div = document.createElement('div');
   var text = document.createTextNode(value);
   div.appendChild(text);
   return div.innerHTML;
}

所以上面的代碼會像這樣

<div id="container">
    <div id="header_area"><tiles:insertattribute name="header"></tiles:insertattribute></div>
    <div id="body_area"><tiles:insertattribute name="body"></tiles:insertattribute></div>
    <div id="sidebar_area"><tiles:insertattribute name="sidebar"></tiles:insertattribute></div>
    <div id="footer_area"><tiles:insertattribute name="footer"></tiles:insertattribute></div>
</div>

.innerHTML可在javascript alert正確呈現。 所以我怎樣才能像第一個那樣呈現代碼片段？ 進行此過程的簡單方法是什么？

Answer 1

好的，所以我假設在您的問題中，第一個引用的塊嵌入在<pre>元素內，如下所示： <pre> <div id="container"> ... </div> </pre>

並且您正在嘗試將其轉換為<pre> <div ... </pre>

問題在於，在加載頁面時， <pre>的內容將加載到DOM中 。 當您獲得pre[i].innerHTML的值時，它將返回一個可以准確表示DOM狀態但與原始HTML不同的值。

如果要保留頁面中使用的確切HTML，則在生成page時需要對HTML進行編碼。 當任何JavaScript都可以訪問內容時，已經為時已晚-原始HTML消失了，剩下的就是DOM內容。

在代碼段HTML中呈現xml和html標簽

問題描述

1 個解決方案

解決方案1
0 2012-09-25 11:53:32

在代碼段HTML中呈現xml和html標簽

問題描述

1 個解決方案

解決方案1 0 2012-09-25 11:53:32

解決方案1
0 2012-09-25 11:53:32