WordPress 如何向需要 jQuery 的页脚添加一个 JavaScript 代码段

问题描述

我知道我可以添加脚本文件到 wordpress 的脚注，这需要使用这个代码的 jquery：

<?php
function my_scripts_method() {
   // register your script location, dependencies and version
   wp_register_script('custom_script',
       get_template_directory_uri() . '/js/custom_script.js',
       array('jquery'),
       '1.0',
       true);
   // enqueue the script
   wp_enqueue_script('custom_script');
}
add_action('wp_enqueue_scripts', 'my_scripts_method');
?>

但是，如果我只想添加一个正常的 jquery 内联代码，而不是一个文件，该怎么办？如何才能做到这一点。

Edit

我知道我可以使用这个脚本向页脚添加一些东西：

<?php
function myscript() {
?>
<script type="text/javascript">
 // This depends on jquery
</script>
<?php
}
add_action('wp_footer', 'myscript');

但是如何指定需要 jquery 运行的脚本。

最佳解决方案

实现此操作的最简单方法实际上是 wp_enqueue_script 和 Saif 和 v0idless 已引用的脚注操作的组合。我经常在我的主题和插件中使用 jQuery，但是我也将所有其他脚本放在页脚中。

实际排队的最好办法是这样做：

function myscript() {
?>
<script type="text/javascript">
  if ( undefined !== window.jQuery ) {
    // script dependent on jQuery
  }
</script>
<?php
}
add_action( 'wp_footer', 'myscript' );

function myscript_jquery() {
    wp_enqueue_script( 'jquery' );
}
add_action( 'wp_head' , 'myscript_jquery' );

但是，这段代码假定您是排队脚本的代码，即您在自己的插件或主题中执行此操作。

目前，没有办法将 in-line 脚本添加到 WordPress 页脚，并且还可以使用依赖关系加载它。但是，如果你愿意，还有一个选择。

替代方案

当 WordPress 使用脚本时，它将内部加载到对象以跟踪它们。对象中基本上有 3 个列表：

注册
队列
DONE
去做

当您首次使用 wp_register_scripts()注册脚本时，它将被放置在注册列表中。当你 wp_enqueue_script()的脚本时，它被复制到队列列表中。在打印到页面之后，它被添加到完成列表中。

所以，而不是排序您的脚注脚本来要求 jQuery，您可以记录它需要使用 jQuery，并且只需检查程序来确保 jQuery 被加载。

这使用 wp_script_is()来检查脚本在哪里列出。

function myscript() {
    if( wp_script_is( 'jquery', 'done' ) ) {
    ?>
    <script type="text/javascript">
      // script dependent on jQuery
    </script>
    <?php
    }
}
add_action( 'wp_footer', 'myscript' );

你也许可以使用相同的代码强制 jQuery 加载在页脚中，但是我没有测试过，所以你的里程我的不同。

次佳解决方案

由于 wordpress 4.5，您可以通过 wp_add_inline_script()添加内联脚本。要将 JavaScript 代码片段添加到需要 jQuery 的页脚，此代码可以帮助您

function enqueue_jquery_in_footer( &$scripts ) {

    if ( ! is_admin() )
        $scripts->add_data( 'jquery', 'group', 1 );
}
add_action( 'wp_default_scripts', 'enqueue_jquery_in_footer' );

function theme_prefix_enqueue_script() {
   if(!wp_script_is('jquery', 'done')) {
     wp_enqueue_script('jquery');
   }
   wp_add_inline_script( 'jquery-migrate', 'jQuery(document).ready(function(){});' );
}
add_action( 'wp_enqueue_scripts', 'theme_prefix_enqueue_script' );

wp_add_inline_script with wordpress jquery