Question

wordpress如何调用js文件？？

Answer 1

一般都是直接在主题的header.php文件中直接引用，部分主题也会在主题的functions.php文件中通过WP自带的函数wp_enqueue_scripts来加载JS文件。

1、在主题header.php文件中直接引入文件，如

<script type='text/javascript' src='http://www.jquery.com/js/jquery/1.10.2/jquery-1.10.2.min.js'></script>

或者

<script src="<?php echo get_template_directory_uri(); ?>/js/jquery/1.10.2/jquery-1.10.2.min.js"></script>

2、在主题的functions.php文件中引入文件，如

function my_enqueue_scripts() {
if( !is_admin ) { // 前台加载的脚本与样式表
// 去除已注册的 jquery 脚本
wp_deregister_script( 'jquery' );
// 注册 jquery 脚本
wp_register_script( 'jquery', get_template_directory_uri() . '/js/jquery/1.10.2/jquery-1.10.2.min.js', false, '1.0', false );
// 提交加载 jquery 脚本
wp_enqueue_script( 'jquery' );
 } 
} 
// 添加回调函数到 init 动作上
add_action( 'init', 'my_enqueue_scripts' );

Answer 2

先上代码：

<?php
$myScriptUrl = WP_PLUGIN_URL . '/my_plugin_1/view/bootstrap-3.3.5/js/bootstrap.min.js';
$myScriptFile = WP_PLUGIN_DIR . '/my_plugin_1/view/bootstrap-3.3.5/js/bootstrap.min.js';
if ( file_exists($myScriptFile) ) {
    wp_register_script('bootstrap', $myScriptUrl);//注册JavaScript
    wp_enqueue_script( 'bootstrap');//引入JavaScript
  
  //注册js中的全局变量
  wp_localize_script( 'bootstrap', 'MyAjax', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) );
}

解析：

    在wordpress中引入js文件，只要用 wp_register_script($p1,$p2)、wp_enqueue_script()这两个函数就好了，其中$p1是自己给要引入的js文件命名，避免和wordpress已经引入的文件起冲突，例如wordpress默认引入了jquery。

$p2就是你js文件的所在位置的url，就是输入在浏览器地址栏时，可以直接放到到这个js文件的网址。

    为了严谨，上面加了一个file_exists判断这个文件是否正确存在。

    WP_PLUGIN_DIR 是wordpress定义的插件plugin所在目录的路径，如果你的js文件不是放在这个目录下，你可以用：

    $myScriptUrl = site_url() . '/yourpath/your_js_file.js';
    $myScriptFile = ABSPATH . '/yourpath/your_js_file.js';

site_url() 指向 WordPress 核心文件的 URL,也就是你的wordpress安装路径。

如果你的 WordPress 核心文件在你的服务器的子目录中，比如 /wordpress，那么 site_url() 的值就会是 http://www.your_domain.com/wordpress 。

ABSPATH 是wordpress目录的绝对路径，如果你的wp安装在服务器主机的根目录内的wordpress文件夹，那么APSPATH = 'your_host_root_path/wordpress';

wp_localize_script( )函数跟你的问题无关，但是是在wp中使用js时很常用很有用的一个函数，你可以百度搜索了解一下。

Answer 3

如果是要调用外部现有的js文件，可以在html中使用如下语句：
<script type="text/javascript" src="js文件的路径"></script>像另外一个人说的那样把js文件添加到模板文件里也是可行的。如果很多页面要调用这个js文件，这样能减少读取js文件的次数，会加快网页的加载速度。不过如果只是个别页面使用该js文件，还是建议使用上面的语句调用，否则会是很多页面加载不需要的东西。

Answer 4

如果是要调用外部现有的js文件，可以在html中使用如下语句：
<script type="text/javascript" src="js文件的路径"></script>像另外一个人说的那样把js文件添加到模板文件里也是可行的。如果很多页面要调用这个js文件，这样能减少读取js文件的次数，会加快网页的加载速度。不过如果只是个别页面使用该js文件，还是建议使用上面的语句调用，否则会是很多页面加载不需要的东西。

Answer 5

在模板文件里面添加需要调用的js文件即可。