How do I escape html in the "innerHtml" property with javascript?

Question

I have a combo of javascript and my jsp that is adding some text and escaping it. I also have some javascrpt that will allow me to edit the text after it has been submitted. However the html renders when Click the edit button.

 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;" is grabbing the text or html in that cell, but if say there is a 'newline' it displays a<br>.....how should I structure this to preserve the escaped html??

thanx

Chetan S · Accepted Answer · 2011-08-15 18:49:33Z

3

Use textContent (or innerText in IE)

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

answered Aug 15, 2011 at 18:49

Chetan S

23.8k2 gold badges67 silver badges78 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Doc Holiday Over a year ago

thanx friend...let me try that

Whome · Accepted Answer · 2013-03-07 09:37:37Z

I had an old web application, no jQuery or other fancy libraries available. I tried if-then-else textContent/innerText fix but some reason did not work for dynamically created DIV element. So had to implement this alternative fix. Tested on Firefox, IE8, IE9 and 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);

Collectives™ on Stack Overflow

How do I escape html in the "innerHtml" property with javascript?

2 Answers 2

1 Comment

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Related