Преобразование HTML в его безопасные объекты с помощью Javascript

Question

Я пытаюсь преобразовать символы типа < и > в < и > и т. Д.

Пользовательский ввод берется из текстового поля, а затем копируется в 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));

ОБНОВЛЕНИЕ

Вы упомянули, что ваше событие срабатывает при каждом нажатии клавиши.Если это то, что вызывает этот код, вы захотите удалить то, что было ранее в div, прежде чем добавлять текст.Простой способ сделать это так:

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

Answer 2

Попробуйте что-то вроде этого:

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

  return input;
}

replace только заменяет первое вхождение> или <в строке, чтобы заменить все вхождения <или>, используйте регулярные выражения с параметром g дляубедитесь, что во всей строке выполняется поиск всех вхождений значений.