javascript textarea createTextNode（）

Question

我想要使用createTextNode（）方法转义从textarea中获取的字符串。将TextNode附加到textarea不起作用。

function myFunc(){ 
    var str = document.getElementById("tarea").value; 
    var chld = document.createTextNode(str); 
    var prnt = document.getElementById("tarea"); 
    prnt.appendChild(chld); 
} 

Answer 1

如果你想拥有的浏览器为你做的工作逃避，我可能会使用该临时的元素，那么使用它的innerHTML作为参数createTextNode：

function myFunc(){ 
 
    var prnt = document.getElementById("tarea"); 
 
    var str = prnt.value; 
 
    var div = document.createElement('div'); 
 
    div.appendChild(document.createTextNode(str)); 
 
    prnt.appendChild(document.createTextNode(div.innerHTML)); 
 
} 
 
myFunc();

<textarea id="tarea">Testing & < ></textarea>

但极少逃脱HTML是很简单的，你不一定需要去全猪：

str = str.replace(/&/g, "&amp;").replace(/</g, "&lt;"); 

（无需>，这很好，因为它是你一个标签内不是。）

如：

function myFunc(){ 
 
    var prnt = document.getElementById("tarea"); 
 
    var str = prnt.value; 
 
    str = str.replace(/&/g, "&amp;").replace(/</g, "&lt;"); 
 
    prnt.appendChild(document.createTextNode(str)); 
 
} 
 
myFunc();

<textarea id="tarea">Testing & < ></textarea>

---

注意，这两个那些追加，因为这就是你的代码试图做的;他们不用替换的内容textarea。如果要这样做，请在追加文本节点之前将其value设置为""。