如何正确添加Bootstrap和JQuery Java脚本?

时间:2016-11-11 作者:Robert Andrews

我正在使用Material Bootstrap Design(MDB)开发我的WordPress主题,这是一种使用Bootstrap 4及其自身代码的Material变体。

信息技术calls for 使用以下脚本。。。

<!-- JQuery -->
<script type="text/javascript" src="/wp-content/themes/blankslate/mdb/js/jquery-2.2.3.min.js"></script>

<!-- Bootstrap tooltips -->
<script type="text/javascript" src="/wp-content/themes/blankslate/mdb/js/tether.min.js"></script>

<!-- Bootstrap core JavaScript -->
<script type="text/javascript" src="/wp-content/themes/blankslate/mdb/js/bootstrap.min.js"></script>

<!-- MDB core JavaScript -->
<script type="text/javascript" src="/wp-content/themes/blankslate/mdb/js/mdb.min.js"></script>
我只是在我的footer.php. 但现在我已经读到,我应该正确地将Javascripts添加到WordPress中,即通过排队。

到目前为止,我用过这个。。。

// Add Javascripts for my Bootstrap theme
function bootstrap_scripts_with_jquery()
{
    // Register the script like this for a theme:
    wp_enqueue_script( \'bootstra-jquery\', get_stylesheet_directory_uri() . \'/mdb/js/jquery-2.2.3.min.js\', array( \'jquery\' ) );
    wp_enqueue_script( \'bootstrap-jquery-min\', get_stylesheet_directory_uri() . \'/mdb/js/jquery.min.js\' );
    wp_enqueue_script( \'bootstrap\', get_stylesheet_directory_uri() . \'/mdb/js/bootstrap.min.js\' );
    wp_enqueue_script( \'bootstrap-material\', get_stylesheet_directory_uri() . \'/mdb/js/mdb.min.js\' );
}
add_action( \'wp_enqueue_scripts\', \'bootstrap_scripts_with_jquery\' );
// http://stackoverflow.com/questions/26583978/how-to-load-bootstrap-script-and-style-in-functions-php-wordpress
在某种程度上,这是可行的——它将我的四行代码添加到了代码中(尽管我不知道这样做是否有任何区别)。

然而,我在标题中还看到了两行我没有添加的剩余/默认JS行。。。

<script type=\'text/javascript\' src=\'http://www.example.com/wp-includes/js/jquery/jquery.js?ver=1.12.4\'></script>
<script type=\'text/javascript\' src=\'http://www.example.com/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.4.1\'></script>
<script type=\'text/javascript\' src=\'http://www.example.com/wp-content/themes/blankslate/mdb/js/jquery-2.2.3.min.js?ver=4.6.1\'></script>
<script type=\'text/javascript\' src=\'http://www.example.com/wp-content/themes/blankslate/mdb/js/jquery.min.js?ver=4.6.1\'></script>
<script type=\'text/javascript\' src=\'http://www.example.com/wp-content/themes/blankslate/mdb/js/bootstrap.min.js?ver=4.6.1\'></script>
<script type=\'text/javascript\' src=\'http://www.example.com/wp-content/themes/blankslate/mdb/js/mdb.min.js?ver=4.6.1\'></script>
我仍然在页脚看到这一行,虽然我没有添加它(我想我想留下这一行,对吗?)。。。

<script type=\'text/javascript\' src=\'http://www.example.com/wp-includes/js/wp-embed.min.js?ver=4.6.1\'></script>
那么,主要的问题是——我应该如何处理WordPress包括jquery.js?ver=1.12.4jquery-migrate.min.js?ver=1.4.1 当我的主题不需要它们的时候?这里有冲突吗?如果WordPress通过向其传递版本号来提供自己的JQuery,我是否可以强制它使用v2。2.3按照我的主题的要求?那么这个“迁移”版本呢?

我知道您可以将脚本出列,并且已经阅读了force a custom version using a filter or similar. 但我也读到过,你不应该在删除WordPress的JQuery默认版本上修修补补。

我很困惑。

我是否需要将CSS排队?

2 个回复
最合适的回答,由SO网友:cjbj 整理而成

WordPress加载jQuery是因为插件和主题假设它会加载。如果你想为你的主题使用另一个版本的jQuery,那么你所使用的插件有可能无法工作,因为(如果它们维护得好的话)它们是为工作而设计的with default jquery.

也就是说,如果您坚持使用自己版本的jQuery,您可以很容易地注销它,正如您所发现的那样。如果你不打算公开发布你的主题,你可以控制后果。

是的,你应该enqueue styles 也这样做的原因是,它允许您设置依赖项,如果(例如)您想创建子主题并取消注册父样式,这一点很重要。

SO网友:Jesper Nilsson

也许这毕竟不是一个WordPress的问题。但据我所知,Bootstrap 4可以与jQuery 1.2.0配合使用。测试Simon PadburysBootstrap 4 Starter Theme 对于WordPress,将WordPress加入(预注册)jQuery。

https://github.com/SimonPadbury/b4st/blob/master/functions/enqueues.php

相关推荐

如何使用两个不同文件向jQuery AJAX调用发送php变量

我需要从一个php文件(page.php)向另一个jquery文件(sender.js)中的Ajax调用发送一个私人电子邮件地址。此电子邮件地址必须对用户/或网站不可见,直到用户从wp\\U mail获得自动响应,它必须允许用户答复组织。此电子邮件地址因客户想要联系的组织而异(数百个)。我必须在表单之前从组织获取电子邮件地址,因为它是由javascript生成的。(generated\\u mail.js)发件人。js在页面的标题中被很好地调用。php我在(page.php)中尝试了这段代码——一个组织在