Регулярное выражение javascript заменяет символы html

Question

Я использую JavaScript, чтобы установить значение ввода с текстом, который может содержать специфичные для HTML символы, такие как &  и т.д. Итак, я пытаюсь найти одно регулярное выражение, которое будет соответствовать этим значениям, и заменить их соответствующим значением ("&", " ") соответственно, только я не могу найти регулярное выражение, чтобы сделать это.

Вот моя попытка:

Создайте объект, который содержит совпадения и ссылку на значение замены:

var specialChars = {
  " " : " ",
  "&"  : "&",
  ">"   : ">",
  "&amp;lt;"   : "<"
}

Затем я хочу сопоставить мою строку

var stringToMatch = "This string has special chars & and  "

Я пробовал что-то вроде

stringToMatch.replace(/( |&)/g,specialChars["$1"]);

но это не работает Я не очень понимаю, как захватить специальный тег и заменить его. Любая помощь с благодарностью.

Answer 1

Я думаю, что вы можете использовать функции из вопроса на немного другой предмет ( Эффективно заменить все акцентированные символы в строке?).

В ответе Джейсона Бантинга есть несколько хороших идей + необходимое объяснение. Вот его решение с некоторыми изменениями, которыепомогут вам начать работу (если вы сочтете это полезным, добавьте также его первоначальный ответ, так как по сути это его код).

var replaceHtmlEntites = (function() {
    var translate_re = /&(nbsp|amp|quot|lt|gt);/g,
        translate = {
            'nbsp': String.fromCharCode(160), 
            'amp' : '&', 
            'quot': '"',
            'lt'  : '<', 
            'gt'  : '>'
        },
        translator = function($0, $1) { 
            return translate[$1]; 
        };

    return function(s) {
        return s.replace(translate_re, translator);
    };
})();

вызываемый как

var stringToMatch = "This string has special chars & and  ";
var stringOutput  = replaceHtmlEntites(stringToMatch);

Нумерованные энтиты еще проще, вы можете заменить их гораздо более обобщенно, используя немного математики иString.fromCharCode(),

---

Другая, гораздо более простая возможность была бы такой (работает в любом браузере)

function replaceHtmlEntites(string) {
    var div = document.createElement("div");
    div.innerHTML = string;
    return div.textContent || div.innerText;
}

replaceHtmlEntites("This string has special chars < & >");
// -> "This string has special chars < & >"

Answer 2

Другим способом будет создание объекта div

var tmp = document.createElement("div");

Затем присвоение текста его внутреннему HTML

tmp.innerHTML = mySpecialString;

И, наконец, чтение текстового содержимого элемента

var output = tmp.textContent || tmp.innerText //for IE compatibility

И вот вы идете...

Answer 3

Вы можете использовать замену на основе функций, чтобы сделать то, что вы хотите сделать:

var myString = '&'+'nbsp;&'+'nbsp;&tab;©';
myString.replace(/&\w+?;/g, function( e ) {
    switch(e) {
        case ' ': 
            return ' ';
        case '&tab;': 
            return '\t';
        case '©': 
            return String.fromCharCode(169);
        default: 
            return e;
    }
});

Тем не менее, я призываю вас рассмотреть вашу ситуацию. Если вы получаете & NBSP; и & копировать; и другие объекты HTML в ваших текстовых значениях, вы действительно хотите заменить их? Должны ли вы конвертировать их потом?

Просто что-то иметь в виду.

Ура!

Answer 4

Более лучшим подходом для замены любых тегов HTML и специальных символов HTML было бы просто заменить их на REGEX

str.replace(/<[^>]*>/g, '').replace(/[^\w\s]/gi, '')

Answer 5

Современный вариант, в котором не используются болезненные операторы switch/case:

const toEscape = `<code> 'x' & "y" </code> <\code>`

toEscape.replace(
  /[&"'<>]/g,
  (char) => ({
      "&": '&amp;',
      "\"": '&quot;',
      "'": '&#39;',
      "<": '&lt;',
      ">": '&gt;',
    })[char]
)

Или, поскольку это действительно должно быть превращено в функцию:

const encodeHTML = function(str) {
    const charsToEncode = /[&"'<>]/g
    const encodeTo = {
      "&": '&amp;',
      "\"": '&quot;',
      "'": '&#39;',
      "<": '&lt;',
      ">": '&gt;',
    }
    return str.replace(charsToEncode, char => encodeTo[char])
}

(Этот список символов выбирается на основе списка кодов XML-escape-char, доступных в Википедии.)