javascript - 如何在Wordpress中添加JS并引用CSS或其他脚本？

Question

所以我正在 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 表示 accordion() 和 have_posts() 未定义。如果我尝试从我的 CSS 中引用特定元素，我也会遇到问题。

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

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

谢谢。

Answer 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，您就可以防止冲突，而且它只会加载一次。