Преобразование Jquery & quot; к буквальной цитате

Question

Я вижу неожиданное поведение в Jquery. Похоже, JQuery конвертирует " к буквальным двойным кавычкам, что мешает проверке формы в одностраничном приложении, над которым я работаю. Контент задается с помощью jquery, после чего поля формы, содержащие " преобразоваться в " который ломает форму.

В качестве теста я попробовал обычные манипуляции с JS-dom и получил разные результаты. Это похоже на версии 1.x и 2.x Jquery.

Вот код, который я попробовал:

// Regular Javascript
var e = document.createElement('div');
var textNode=document.createTextNode('&');
e.appendChild(textNode)
console.log(e.childNodes) //=> ['&']

var e = document.createElement('div');
var textNode=document.createTextNode('"');
e.appendChild(textNode)
console.log(e.childNodes) //=> ['"']

// vs. Jquery

e = $('<div>')
content = '&amp;'
e.html(content)
console.log(e.html()) //=> &amp;

e = $('<div>')
content = '&quot;'
e.html(content)
console.log(e.html()) // => " (a quote)

Какие-нибудь мысли?

Редактировать Jquery doc говорит, что.html() основан на реализации браузеров innerHTML. Однако, используя чистый код JS сверху: console.log(e.innerHTML) приводит к: & и & quot; соответственно.

Кроме того, вызывая innerHTML для фактического dom, хранящегося в jquery yeilds: console.log(e.get(0).innerHTML) & и "соответственно.

e = $('<div />');
content = '&quot;'
e.html(content)
console.log(e.get(0).innerHTML) // => "
console.log(e.html()) // => "
console.log(e.text()) // => "

e = $('<div />');
content = '&amp;'
e.html(content)
console.log(e.get(0).innerHTML) //=> &amp;
console.log(e.html()) //=> &amp;
console.log(e.text()) //=> &

Answer 1

Метод $.html() будет декодировать / кодировать сущности HTML. Чтобы обойти это поведение, рассмотрите использование $.text() вместо этого:

var e = $("<div>"), content = "&quot;";
e.text(content);
console.log(e.text()); // outputs &quot;

РЕДАКТИРОВАТЬ

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

var e = $("<div>"), content = "&quot;&amp;";
e.html(content);
console.log(e.html()); // outputs "&amp;

var e_encoded = e.html().replace(/"/g, "&quot;");
console.log(e_encoded); // outputs &quot;&amp;

Имейте в виду, что вышеупомянутое также закодирует любые кавычки, используемые для атрибутов HTML в любых тегах, содержащихся в content переменная, которая, очевидно, почему $.html() Метод не кодирует их для начала.

Надеюсь, это поможет!

Answer 2

Использовать .text() метод, а не .html(),

Answer 3

Консенсус в том, что это ожидаемое поведение, потому что jquery просто оборачивает метод innerHTML браузера.

Это печальная новость для одностраничных приложений, которые должны различать "и" в отображаемой форме и т. Д.