## WP_SCRIPT_ADD_DATA() │ WP 4.2.0
Функция wp_script_add_data() позволяет добавить метаданные к скрипту в WordPress. Она работает только если скрипт уже зарегистрирован.
### Возможные значения
- **$key** и **$value**:
- 'conditional' — строка, содержащая условие для Internet Explorer, например, для версий IE 6 и ниже, IE 7 и т.д.
### Возвращаемое значение
- **true** — если добавление данных прошло успешно.
- **false** — если возникла ошибка.
### Использование
```php
wp_script_add_data( $handle, $key, $value );
- $handle (string, обязательный) — имя скрипта.
- $key (string, обязательный) — название метаданных, которые мы хотим сохранить.
- $value (mixed, обязательный) — строка с данными для добавления.
Примеры
Пример 1: Подключение скрипта только для IE версий ниже 9
В этом примере мы добавим условие, чтобы подключать скрипт только для Internet Explorer версии ниже 9.
add_action( 'wp_enqueue_scripts', 'my_enqueue_scripts' );
function my_enqueue_scripts() {
// Подключаем специальный скрипт только для Internet Explorer 6
wp_enqueue_script('pngfix', get_template_directory_uri() . 'js/pngfix.js');
// Добавляем условие
wp_script_add_data('pngfix', 'conditional', 'lt IE 9');
}
В результате в <head> документа появится:
Пример 2: Добавление атрибута async или defer к зарегистрированному скрипту
add_action( 'wp_enqueue_scripts', 'my_enqueue_scripts' );
function my_enqueue_scripts() {
wp_enqueue_script( 'app', get_template_directory_uri() . 'js/app.js' );
// Добавляем атрибут defer к зарегистрированному скрипту
wp_script_add_data( 'app', 'defer', true );
}
add_filter( 'script_loader_tag', 'support_async_defer_script_attrs', 10, 2 );
function support_async_defer_script_attrs( $tag, $handle ) {
foreach ( [ 'async', 'defer' ] as $attr ) {
if ( ! wp_scripts()->get_data( $handle, $attr ) ) {
continue;
}
// Проверяем, добавлен ли атрибут уже
if ( ! preg_match( ":s{$attr}[=>s]:", $tag ) ) {
$tag = preg_replace( ':(?=>):', " $attr", $tag, 1 );
}
break; // Разрешить только async или defer, но не оба.
}
return $tag;
}
После выполнения получим следующий код в <head>:
Пример 3: Поддержка async/defer
add_action( 'wp_enqueue_scripts', 'twentytwenty_register_scripts' );
add_filter( 'script_loader_tag', 'filter_script_loader_tag', 10, 2 );
function twentytwenty_register_scripts() {
wp_enqueue_script( 'twentytwenty-js', get_template_directory_uri() . '/assets/js/index.js', [], '1.0', false );
// Добавляем атрибут async
wp_script_add_data( 'twentytwenty-js', 'async', true );
}
function filter_script_loader_tag( $tag, $handle ) {
foreach ( array( 'async', 'defer' ) as $attr ) {
if ( ! wp_scripts()->get_data( $handle, $attr ) ) {
continue;
}
// Проверяем, чтобы атрибут не был добавлен дважды
if ( ! preg_match( ":s$attr(=|>|s):", $tag ) ) {
$tag = preg_replace( ':(?=>):', " $attr", $tag, 1 );
}
break; // Разрешить только async или defer, но не оба.
}
return $tag;
}
Заметки
- Для получения дополнительной информации смотрите метод
WP_Dependencies::add_data().
Изменения
- Уведомление о введении: начиная с версии 4.2.0.