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

发布于 2024-09-06 10:51:50 字数 743 浏览 7 评论 0原文

我正在尝试将 < 和 > 等字符转换为 < 和 > 等。

用户输入从文本框中获取，然后复制到名为 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;');

但我得到了相同的结果。

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

原文

I'm trying to convert characters like < and > into < and > etc.

User input is taken from a text box, and then copied into a DIV called changer.

here's my code:

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

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

But it doesn't seem to replace >, only <. Also tried like this:

input = input.replace('<', '<').replace('>', '>');

But I get the same result.

Can anyone point out what I'm doing wrong here? Cheers.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

逐鹿 2024-09-13 10:51:50

更可靠的方法是创建一个 HTML 文本节点；这样，所有其他可能无效的内容（不仅仅是 < 和 >）都会被转换。例如：

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));

A more robust way to do this is to create an HTML text node; that way all of the other potentially invalid content (there's more than just < and >) is converted. For example:

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

UPDATE

You mentioned that your event was firing upon each key press. If that's what's triggering this code, you'll want to remove what was previously in the div before appending the text. An easy way to do that is like this:

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

回复收藏 0 原文

醉南桥 2024-09-13 10:51:50

尝试这样的操作：

function convertHTML(input)
{
  input = input.replace(/>/g, '>');
  input = input.replace(/</g, '<');

  return input;
}

替换仅替换第一次出现的 >或<在字符串中，为了替换所有出现的 <或 >，使用带有 g 参数的正则表达式，以确保在整个字符串中搜索所有出现的值。

Try something like this:

function convertHTML(input)
{
  input = input.replace(/>/g, '>');
  input = input.replace(/</g, '<');

  return input;
}

replace only replaces the first occurrence of > or < in the string, in order to replace all occurrences of < or >, use regular expressions with the g param to ensure the entire string is searched for all occurrences of the values.

回复收藏 0 原文

~没有更多了~