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

Question

我试图字符转换像<和>成<和>等.

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

这是我的代码:

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

一种更健壮的方法是创建一个HTML文本节点 ; 这样,所有其他可能无效的内容(不仅仅是<和>)都会被转换.例如:

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

UPDATE

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

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