上面是搬码源码网 abnma.com 经由过程收集网络收拾整顿的代码片断。搬码源码网小编此刻分享给各人,也给各人做个参考。
在 wordpress 主题或插件中加载 JavaScript 时,民间保举的要领是应用 wp_enqueue_script() 来加载,该函数可以指定 JavaScript 的依靠库,指定 JavaScript 文件的版本,设置在页面头部或许底部加载,很是矫捷和利便。可是,该插件短少指定在某些页面加载 JavaScript 的设置参数。所幸的是,咱们可以经由过程 WordPress 的函数本身下手来完成这个功效。
当一个比力年夜的库只在某一个或几个页面应用时,咱们不需求在每个页面上加载一切剧本,而只要要在特定的页面模板中加载即可,以免其余页面加载不需求的 JavaScript 文件而影响页面关上速率,增长办事器开支。
好比,咱们的主题中有一个名为 “Portfolio Archive” 的页面模板,在这个模板中,咱们需求应用 “imagesloaded、masonry、isotope、jquery-ias” 这 4 个 JavaScript 插件来完成这个页面的后果,而这些库在其余页面都是用不上的,假如间接在全数页面加载,每个页面城市加载这 4 个库,纵然是这个页面不需求应用这些库来完成后果。
只在应用了某个页面模板的页面上加载指定的 JavaScript 文件吗,鄙人面的代码中,首页咱们加载了每个页面都需求的 jQuery 和 Main.js 文件,然后判定以后页面是否应用了指定的页面模板,然后按照判定成果加载指定页面模板需求的 JavaScript 文件。
//注册加载函数到 hook 上 add_action('wp_enqueue_scripts','my_theme_load_scripts'); // 加载样式和剧本 function my_theme_load_scripts(){ wp_enqueue_script('jquery'); // 加载每个页面都需求的 JavaScript 文件 wp_enqueue_script('my_second_script',get_template_directory_uri() . '/js/main.js'); if(is_page()){ //查抄以后页面 global $wp_query; // 插件是否应用了某页面模板 $template_name = get_post_meta( $wp_query->post->ID,'_wp_page_template',true ); if($template_name == 'portfolio-archive.php'){ // 假如应用了指定的页面模板,加载需求库 wp_enqueue_script('my_third_script',get_template_directory_uri() .'/js/imagesloaded.js'); ... } } }
在现实的 WordPress 主题开发事情中,并不是每个主题都需求这么操作。假如某主题应用的 JavaScript 文件比力少,全数加载一路也没有多年夜,咱们完全可以把这些 JavaScript 文件归并在一路文件中,如许不单可以削减页面哀求数,还可以把剧本文件缓存到客户端,关上下一个页面的时辰不消再下载一次。详细什么时辰归并代码到一个文件,什么时辰拆分代码按需加载,要望主题的现实环境,矫捷断定。
以上是搬码源码网(abnma.com)为你网络收拾整顿的全数代码内容,但愿文章可以或许帮你解决所碰到的步伐开提问题。假如感觉搬码源码网网站内容还不错,接待将搬码源码网网站保举给步伐员挚友。
总结
以上是搬码源码网为你网络收拾整顿的指定 WordPress 页面按需加载 JavaScript全数内容,但愿文章可以或许帮你解决指定 WordPress 页面按需加载 JavaScript所碰到的步伐开提问题。
假如感觉搬码源码网网站内容还不错,接待将搬码源码网网站保举给步伐员挚友。
请先
!