javascript - 使用 Javascript 将 HTML 转换为其安全实体

Question

我正在尝试转换像 < 这样的字符和 >进入<和 >等等

用户输入从文本框中获取，然后复制到名为 changer 的 DIV 中.

这是我的代码:

function updateChanger() {
    var message = document.getElementById('like').value;
    message = convertHTML(message);
    document.getElementById('changer').innerHTML = message;
}

function convertHTML(input)
{
    input = input.replace('<', '&lt;');
    input = input.replace('>', '&gt;');
    return input;
}

但它似乎并没有取代> , 只有 < .也试过这样:

input = input.replace('<', '&lt;').replace('>', '&gt;');

但我得到了相同的结果。

谁能指出我在这里做错了什么？干杯。

Answer 1

一个更可靠的方法是 create an HTML text node ;这样所有其他可能无效的内容(不仅仅是 < 和 >)都会被转换。例如:

var message = document.getElementById('like').value;
document.getElementById('changer').appendChild(document.createTextNode(message));

更新

您提到您的事件在每次按键时触发。如果这是触发此代码的原因，您需要在附加文本之前删除 div 中之前的内容。一个简单的方法是这样的:

var message = document.getElementById('like').value;
var changer = document.getElementById('changer');
changer.innerHTML = '';
changer.appendChild(document.createTextNode(message));