如何将 JS 添加到 Wordpress 并引用 CSS 或其他脚本？答案

【问题标题】：How to add JS to Wordpress and reference CSS or other scripts?如何将 JS 添加到 Wordpress 并引用 CSS 或其他脚本？
【发布时间】：2015-03-22 07:00:46
【问题描述】：

所以我正在 Wordpress 中开发自定义主题。我以前在head.php中有一大堆JS，像这样：

jQuery(document).ready(function($) {

    $('.widgetblock').accordion({
        //args
    });


    if ( have_posts() ) {
        //stuff
    }
});

但是我已经读到在 Wordpress 中添加 JS 的正确方法是在 functions.php 中使用 wp_enqueue_script()，所以我正在尝试这样做那。我所做的只是将相同的代码放入我保存在相应文件夹中的 .js 文件中，然后像这样加载它：

function script_assets() {
    wp_enqueue_script( 'js-code', get_template_directory_uri() . '/js/js-code.js', array( 'jquery', 'jquery-ui-widget' ) );
}

add_action( 'wp_enqueue_scripts', 'script_assets' );

我已将 JQuery 和 JQuery UI 添加为依赖项。

但是，这不起作用。 Chrome 说手风琴() 和 have_posts() 没有定义。如果我尝试从我的 CSS 中引用特定元素，我也会遇到问题。

那么，我该怎么办？这可能是一个非常基本的问题，但我找不到解决方法。

另一个问题是，我如何确保 100% 确定在 CSS 之后加载了一些 JS 脚本？我正在使用-prefix-free，它应该在它之后立即加载，但我不确定 wp_enqueue 是否可能...... 编辑：我不能真正在页脚中加载该脚本，它需要在 CSS 之后立即加载。：/

谢谢。

【问题讨论】：

标签： javascript jquery css wordpress

【解决方案1】：

每次我不得不将 jQuery 添加到 WordPress 网站时，我都会使用我在 CSS-tricks 上找到的这段代码

if (!is_admin()) add_action("wp_enqueue_scripts", "my_jquery_enqueue", 11);
 function my_jquery_enqueue() {
 wp_deregister_script('jquery');
 wp_register_script('jquery', "http" . ($_SERVER['SERVER_PORT'] == 443 ? "s" : "") . "://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js", false,    null);
 wp_enqueue_script('jquery');
}

据我了解，一旦以这种方式加载 jQuery，就可以防止冲突，并且它只会加载一次。

【讨论】：

【解决方案2】：

好吧，其他人发布了答案，但随后将其删除了...

我在这里使用的依赖wp_enqueue_script( 'js-code', get_template_directory_uri() . '/js/js-code.js', array( 'jquery', 'jquery-ui-widget' ) ); 是错误的；我应该使用 jquery-ui-accordion，jquery-ui-widget 不包括在内。我选择包含整个 jquery-ui（这样我就可以使用其他功能而不必为每个功能添加特定的依赖项），但要做到这一点，我必须链接到 Google，因为 WP 中没有完整的包。

这解决了我的一些问题，而不是所有问题（-prefix-free 脚本仍然没有在样式表之后立即加载，我必须找到一种方法来替换我之前使用的 PHP 函数）但是网站可以正常工作，所以就是这样:)

感谢实际回答的人，我不记得你的用户名了，抱歉。

【讨论】：