如何使用javascript在“innerHtml”属性中转义html？

Question

我有一个组合的JavaScript和我的jsp，它添加了一些文本并转义它。我还有一些javascrpt，它允许我在提交文本后对其进行编辑。然而，当点击编辑按钮时，html呈现。

function editCommentToggle(id) 
{ 
    theRow = document.getElementById("id"+id); 
    //user = theRow.cells[0].innerHTML; 
    //date = theRow.cells[1].innerHTML; 
--> com = theRow.cells[2].innerHTML; 


    idx = 2; 
    maxlength = 250; 

       // Comment field 
     cell = theRow.cells[idx]; 
     while(cell.childNodes.length > 0) cell.removeChild(cell.childNodes[0]); 
     element = document.createElement("textarea"); 
     element.id="comments-"+id; 
     element.rows="3"; 
     element.value = com; 
     element.style.width = "400px"; 
     element.maxLength = "250"; 
     element.onfocus = element.onkeydown = element.onkeyup = function(){return characterCounterEdit(undefined, maxlength, this);}; 
     cell.appendChild(element); 

“theRow.cells [2] .innerHTML;”正在抓取该单元格中的文本或html，但如果说有'换行'，它会显示一个<br> .....我应该如何构造这个以保留转义的html？

感谢名单

Answer 1

使用的textContent（或中的innerText IE）

com = theRow.cells[2].textContent || theRow.cells[2].innerText 

Answer 2

我有一个旧的Web应用程序，没有任何的jQuery或其他奇特的库可用。我尝试了if-then-else textContent/innerText修复，但有些原因对于动态创建的DIV元素无效。所以不得不实施这个替代解决方案。测试Firefox，IE8，IE9和Opera。

// XMLEscape reserverd characters 
function XMLEscape(sValue, bUseApos) { 
    var sval=""; 
    for(var idx=0; idx < sValue.length; idx++) { 
    var c = sValue.charAt(idx); 
    if  (c == '<') sval += "&lt;"; 
    else if (c == '>') sval += "&gt;"; 
    else if (c == '&') sval += "&amp;"; 
    else if (c == '"') sval += "&quot;"; 
    else if (c == '\'') sval += (bUseApos ? "&apos;" : "&#39;"); 
    else sval += c; 
    } 
    return sval; 
} 

var sprite = document.createElement("DIV"); 
sprite.setAttribute("class", "sprite_red"); 
sprite.setAttribute("style", "top:" + nextOffsetTop +"px"); 
sprite.innerHTML = XMLEscape(items[idx]); 
scene.append(sprite);