Не работает кусок js на WordPress?

Question

[unlik]

Есть такой кусок кода

var replaced = $("body").html().replace('о','е');
$("body").html(replaced);

Заменяет букву на странице. На обычной html странице все заменяется. Вставляю в шаблон wordpress и перестает работать. В чем может быть дело?

Answer 1

[Александр Соболев]

1) Правильное подключаем скрипт:

function js_includer() {   
  wp_register_script('your_js_id',  get_stylesheet_directory_uri().'your_js.js'); //<-- Путь, если js файл в корне темы. Уточните возврат функции, возможно перед your_js.js нужен "слеш".
  wp_enqueue_script('your_js_id');    
}
add_action( 'admin_enqueue_scripts', 'js_includer' ); add_action( 'wp_enqueue_scripts', 'js_includer' );

2) Заменяем $ на jQuery и помещаем файл your_js.js в корень нужной темы.

jQuery(document).ready(function(){
   var replaced = jQuery("body").html().replace('о','е');
   jQuery("body").html(replaced);
});

Можно, конечно, подключить функцию в footer но это.. на мой взгляд так себе решение

Comments

[yarovikov]

Заменяем $ на jQuery - зачем?

[Александр Соболев]

yarovikov, Так исторически сложилось, что по умолчанию копия jQuery находится в режиме совместимости. Это означает, что привычный нам шорткат ‘$’ будет не работать. Сделано это для того чтобы не создавать конфликтов с другими библиотеками
Выйти можно заменив доллар на jQuery (по "старинке" - дело привычки))) ), или обернув код, например как это показал Денис Янчевский (function($) { } )( jQuery ) или jQuery(document).ready(function( $ ) { } );

Answer 2

[Денис Янчевский]

А так?

(function ($) {
    $(document).ready(function () {
        var replaced = $("body").html().replace('о','е');
        $("body").html(replaced);
    });
})(jQuery);

+ ошибки в Консоли Инструментов разработчика в браузере гляньте.

Comments

[Александр Соболев]

true. Или так: Query(document).ready(function( $ ) { } );

[unlik]

Да, работает так. А от чего зависит?

[Денис Янчевский]

unlik, в WordPress jQuery подключается в режиме noConflict и $ перестает быть глобальным алиасом для jQuery.
Код в ответе задает алиас $ локально для нашего кода.