печатать HTML-теги в JavaScript - PullRequest
Новая
       19

печатать HTML-теги в JavaScript

3 голосов
/ 12 апреля 2011

Спасибо за чтение! 

var data = "<html><head><title>Hello</title></head><body>Hello Body</body></html>";

Я хочу напечатать data, включая теги HTML без браузера, отображающего теги HTML и просто отображающего «Hello Body».

Я пытался:

str = str.replace("<", "");

но напрасно.

Ответы [ 3 ]

11 голосов
/ 12 апреля 2011 
 data = data.replace(/</g, "&lt;").replace(/>/g, "&gt;");

Когда браузер обнаруживает &lt; (который известен как символьная сущность), он заменяет его литералом '<', что позволяет отображать теги HTML на странице без их визуализации.</p>

/</g - это регулярное выражение, которое просто говорит «соответствовать всем» <в строке », а <code>g означает, что это делается глобально.Без g он заменит только первое «<», с которым он столкнется.</p>

И последнее замечание: для этого гораздо лучше использовать библиотеку, такую ​​как jQuery.Это тот тип вещей, который легко ошибиться и пропустить крайние случаи.Пусть закаленная, хорошо протестированная и безопасная библиотечная функция сделает это за вас.

9 голосов
/ 12 апреля 2011

Фактическое (и более безопасное исправление) следующее: 

function htmlspecialchars(text){
    return jQuery('<div/>').text(text).html();
}

В чистом JavaScript это будет: 

function htmlspecialchars(text){
    var tnd=document.createTextNode(text);
    var div=document.createElement("DIV");
    div.appendChild(tnd);
    return div.innerHTML;
}
3 голосов
/ 12 апреля 2011

Это ужасно, но вы можете попробовать это (заимствовано из реализации Prototype escapeHTML()): 

var data = "<html> <head> <title> Hello </title> </head> <body> Hello Body </body> </html>"
    .replace(/&/g,'&amp;')
    .replace(/</g,'&lt;')
    .replace(/>/g,'&gt;');

document.write(data);

Конечно, было бы лучше создать небольшую вспомогательную функцию.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...