Справочный раздел
Экранирование символов: HTML, URL, JSON, JavaScript, RegExp и Markdown
Сравнение правил экранирования для HTML, URL-компонентов, JSON-строк, JavaScript, регулярных выражений и Markdown с готовыми значениями для копирования.
Быстрое сравнение
Один символ в шести контекстах
Колонки используют допущения, описанные ниже. Нажмите значение, чтобы точно скопировать его; SP, LF и TAB — видимые обозначения пробельных символов.
Подходящих символов или последовательностей не найдено.
| Символ | HTML | URL | JSON | JavaScript | RegExp | Markdown |
|---|---|---|---|---|---|---|
| & Амперсанд | ||||||
| < Знак меньше | ||||||
| > Знак больше | ||||||
| " Двойная кавычка | ||||||
| ' Апостроф | ||||||
| ` Обратная кавычка | ||||||
| SP Пробел | ||||||
| / Косая черта | ||||||
| \ Обратная косая черта | ||||||
| # Решётка | ||||||
| ? Вопросительный знак | ||||||
| = Знак равенства | ||||||
| % Знак процента | ||||||
| . Точка | ||||||
| ^ Циркумфлекс | ||||||
| $ Знак доллара | ||||||
| | Вертикальная черта | ||||||
| * Звёздочка | ||||||
| + Знак плюса | ||||||
| () Круглые скобки | ||||||
| [] Квадратные скобки | ||||||
| {} Фигурные скобки | ||||||
| LF Перевод строки | ||||||
| TAB Табуляция |
Сначала контекст
Что означает каждая колонка
Экранирование бывает правильным только относительно парсера, который прочитает результат.
Заменяйте &, <, > и кавычки на символьные ссылки. Для текста безопаснее назначать textContent, а не собирать разметку строками.
Вход
Учтите: Правила отличаются для текста, атрибутов, URL внутри атрибутов и содержимого <script>. <span title="A&B"> Результат Кодируйте данные через encodeURIComponent или URLSearchParams. Не кодируйте целый URL как один компонент.
Вход
Учтите: Апостроф, !, *, ( и ) encodeURIComponent не меняет; для строгого RFC 3986 их иногда кодируют дополнительно. a+b & c/d Результат Экранируйте кавычку, обратную косую черту и управляющие символы. На практике используйте JSON.stringify.
Вход
Учтите: JSON — формат данных, а не фрагмент JavaScript: комментарии, одинарные кавычки и завершающие запятые не входят в стандарт. He said "hi" + LF Результат Экранируйте двойную кавычку, обратную косую черту и управляющие символы. У шаблонных строк отдельные правила для ` и ${…}.
Вход
Учтите: Не вставляйте недоверенные данные в код. Передавайте их как данные или сериализуйте подходящим для границы способом. C:\temp\new Результат Ставьте обратную косую черту перед метасимволами ^ $ \ . * + ? ( ) [ ] { } | и перед / внутри литерала /…/.
Вход
Учтите: В строке для конструктора RegExp обратную косую черту приходится экранировать ещё раз на уровне JavaScript-строки. price: 10.00? Результат Добавляйте обратную косую черту перед ASCII-пунктуацией, только когда знак может стать разметкой.
Вход
Учтите: Правила зависят от позиции: #, +, -, > и точка после цифры особенно важны в начале строки. *literal* [text] Результат Безопасные границы
Три вопроса перед экранированием
- 1
Куда попадёт значение?
Текст HTML, HTML-атрибут, параметр URL, JavaScript-строка и шаблон RegExp — разные контексты разбора.
- 2
Какой слой прочитает его первым?
Шаблону, прошедшему через JSON и затем RegExp, может понадобиться сериализация на каждой границе, но не слепое двойное экранирование.
- 3
Можно ли доверить работу сериализатору?
Предпочитайте textContent, URLSearchParams, JSON.stringify и API для данных. Ручные цепочки замен легко применить в неверном порядке.
Спецификации
HTML, URL, JSON, JavaScript, RegExp и CommonMark.
Связанные инструменты
Продолжите работу с текстом
Скопируйте символ, преобразуйте разметку, очистите фрагмент или сохраните результат в блокноте.
- Кодировать и декодировать HTML-сущности Преобразуйте спецсимволы в безопасные HTML-сущности и обратно.
- Конвертировать Markdown в HTML Подготовьте HTML-разметку из Markdown-черновика.
- Удалить HTML-теги Оставьте читаемый текст без разметки.
- Изменить регистр текста Переведите буквы в верхний или нижний регистр.
- Открыть онлайн-блокнот Используйте скопированные символы в локальной заметке.
FAQ
Вопросы об экранировании символов
Экранирование и кодирование — одно и то же?
Не совсем. Экранирование защищает синтаксис внутри конкретной грамматики, а кодирование переводит данные в другое представление. Процентное кодирование URL и символьные ссылки HTML обычно рассматривают рядом, потому что они решают ту же задачу на границе контекстов.
Почему нельзя экранировать значение дважды?
Второй проход обычно экранирует результат первого: & превращается в &amp;, а % — в %25. Сериализуйте один раз для каждой реальной границы парсера и храните исходное значение внутри программы.
Можно ли экранировать HTML регулярным выражением?
Нет. Помещайте обычный текст через textContent, атрибуты задавайте DOM API или используйте контекстное экранирование надёжного шаблонизатора.
Почему / экранируется в литерале RegExp, но не всегда в RegExp()?
В записи /pattern/ косая черта закрывает литерал, поэтому нужна запись /. В new RegExp(pattern) шаблон передаётся JavaScript-строкой и / не является разделителем, но правила обратных косых черт самой строки сохраняются.
Нужно ли экранировать всю пунктуацию Markdown?
Нет. CommonMark допускает backslash-экранирование ASCII-пунктуации, но применять его нужно там, где знак иначе станет разметкой. Позиция особенно меняет смысл #, +, -, > и точки после номера списка.