Функция esc_js() в WordPress с примерами

Функция esc_js() экранирует текст для безопасного вывода в JavaScript. Она защищает текст от ошибок при интерпретации в JavaScript, экранируя одинарные и двойные кавычки, символы <, >, &, а также исправляет окончания строк.

Эта функция предназначена для использования в сценариях, где текст включается в JavaScript-код, особенно для HTML-атрибутов, таких как onclick.

esc_js( string $text ): string

Параметры

• $text (строка, обязательный): Текст, который нужно экранировать для безопасного использования в JavaScript.

Возвращаемое значение

• string: Экранированный текст, готовый для использования в JavaScript.

Пример 1: Экранирование текста для JavaScript

В этом примере строка, содержащая специальные символы, экранируется с помощью esc_js().

$text = "кавычка ', двойная \", больше >, меньше <, амперсанд &";
echo esc_js( $text );

// Вывод: кавычка \', двойная &quot;, больше &gt;, меньше &lt;, амперсанд &amp;

Пример 2: Использование с HTML-атрибутами и JS

Часто встречающийся сценарий — использование esc_js() для экранирования текста, который будет использоваться в JavaScript-обработчиках событий, таких как onfocus и onblur, наряду с esc_attr() для HTML-атрибутов.

<input type="text" 
    value="<?php echo esc_attr( $instance['input_text'] ); ?>" 
    id="subbox"
    onfocus="if ( this.value == '<?php echo esc_js( $instance['input_text'] ); ?>' ) { this.value = ''; }"
    onblur="if ( this.value == '' ) { this.value = '<?php echo esc_js( $instance['input_text'] ); ?>'; }"
    name="email" />

Пример 3: Альтернатива с использованием wp_json_encode()

Вместо использования esc_js() можно применить wp_json_encode(), которая экранирует строку для использования в JavaScript и автоматически добавляет кавычки. Это особенно удобно, если необходимо работать с более сложными данными.

<?php
$onfocus = sprintf( 
	'if ( %s === this.value ) { this.value = ""; }',
	wp_json_encode( $instance['input_text'] )
);
$onblur = sprintf(
	'if ( "" === this.value ) { this.value = %s; }',
	wp_json_encode( $instance['input_text'] )
);
?>
<input id="subbox" type="text" name="email"
	value="<?php echo esc_attr( $instance['input_text'] ); ?>"
	onfocus="<?php echo esc_attr( $onfocus ); ?>"
	onblur="<?php echo esc_attr( $onblur ); ?>" />

Альтернативы

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

Особенности

• Хук js_escape: Эта функция применяет фильтр js_escape, который может быть изменен или дополнен плагинами.
• Pluggable-функция: Как и многие другие функции WordPress, esc_js() может быть переопределена плагинами, если это необходимо.

Заключение

Функция esc_js() — это полезный инструмент для защиты текстовых строк, используемых в JavaScript-коде WordPress. Она помогает предотвратить ошибки интерпретации и улучшает безопасность веб-сайта.