Преобразование тегов в HTML сущности
Раздел(ы): HTML & CSS, JAVA & PHP, WordPress, Вебмастеру
Просмотры: 5439
Комментарии: 0
Когда необходимо опубликовать исходный HTML код у себя в статье на сайте, то часто браузер указанный текст понимает как код, то есть выполняет его. Решить проблему должны специально выделенные для этого теги PRE и CODE. Но если у вас что-то пошло не так, то в этой статье я расскажу, как преобразовать HTML теги в сущности (в изображения), чтобы они не воспринимались браузером как команды.
Написание HTML тегов
Как известно все HTML теги начинаются с левой угловой скобки (знак меньше). Если ее заменить на ее код-сущность, то браузер уже не будет воспринимать дальнейший текст как код тега.
Чтобы код отображался как текст, а не понимался браузером как команды, достаточно заменить следующие спецсимволы на их сущности:
- [exec]echo htmlspecialchars(«<", ENT_QUOTES);[/exec] на [exec]echo htmlspecialchars("<", ENT_QUOTES);[/exec]
- [exec]echo htmlspecialchars(«>», ENT_QUOTES);[/exec] на [exec]echo htmlspecialchars(«>», ENT_QUOTES);[/exec]
- [exec]echo htmlspecialchars(‘»‘, ENT_QUOTES);[/exec] на [exec]echo htmlspecialchars(«"», ENT_QUOTES);[/exec]
- [exec]echo htmlspecialchars(«&», ENT_QUOTES);[/exec] на [exec]echo htmlspecialchars(«&», ENT_QUOTES);[/exec]
Таблица специальных символов и коды их сущностей
| Символ (вид) | Цифровой код | HTML-код | CSS-код | Описание |
|---|---|---|---|---|
| < | Знак «меньше чем» (начало тега) | |||
| > | Знак «больше чем» (конец тега) | |||
| " | Двойная кавычка | |||
| & | Амперсанд |
Теги PRE CODE XMP
Немного о тегах которые должны помочь, но не помогут или являются невалидными.
<pre> — «preformatted» — блочный элемент, который определяет блок предварительно форматированного текста.
<code> — строчный элемент, предназначенный для отображения одной или нескольких строк текста, который представляет собой программный код.
Эти теги оформляют текст, но не преобразуют его в сущности!!!
<xmp> — позволяет отображать фрагмент текста том виде, в каком он представлен внутри тега. Вот то что нам нужно для отображения сущностей! Но, к сожалению, он уже давно исключён из HTML-спецификации и его поддержка может быть прекращена любым браузером в любой момент.
PHP функции по преобразованию кода в сущности
Чтобы преобразовать код в сущности можно воспользоваться PHP функций htmlspecialchars(). Пример ее использования:
<?php
echo htmlspecialchars("<div>HTML</div>", ENT_QUOTES);
// <div>HTML</div>
?>
Необязательный второй аргумент quote_style определяет режим обработки одиночных и двойных кавычек. В режиме по умолчанию, ENT_COMPAT, преобразуются двойные кавычки, одиночные остаются без изменений. В режиме ENT_QUOTES преобразуются и двойные, и одиночные кавычки. а в режиме ENT_NOQUOTES и двойные, и одиночные кавычки остаются без изменений.
Если у вас WordPress, то используйте функцию esc_html_e().
<?php esc_html_e('<div>HTML</div>'); //<div>HTML</div>?>
На экране в обоих случая будет выведено:
<div>HTML</div>
То есть код будет отображаться, а не выполняться.
Благодарности
При написании статьи были использованы следующие источники:
