WordPress异步加载JS代码版

WordPress767.6K阅读模式

上篇 《WordPress异步加载JavaScript插件:Async JavaScript》推荐了一款异步加载JavaScript的插件,如果有童鞋不喜欢用插件,可以用下面这段从插件中提取出来的代码,也能达到使用插件相似的功能。

将下面代码添加到当前主题functions.php中:

  1. // 异步加载JS
  2. add_filter( 'script_loader_tag', 'async_script', 10, 3 );
  3. function async_script( $tag, $handle, $src ) {
  4.     $zm_method = 'async';// 可将“async”改为“defer”
  5.     $zm_exclusions = 'jquery.min.js,script.js';// 排除的JS
  6.     $array_exclusions = !empty( $zm_exclusions ) ? explode( ',', $zm_exclusions ) : array();
  7.     if ( false !== $zm_enabled && false === is_admin() ) {
  8.         if ( !empty( $array_exclusions ) ) {
  9.             foreach ( $array_exclusions as $exclusion ) {
  10.                 $exclusion = trim( $exclusion );
  11.                 if ( $exclusion != '' ) {
  12.                     if ( false !== strpos( strtolower( $src ), strtolower( $exclusion ) ) ) {
  13.                         return $tag;
  14.                     }
  15.                 }
  16.             }
  17.         }
  18.         $tag = str_replace( 'src=', $zm_method . "='" . $zm_method . "' src=", $tag );
  19.         return $tag;
  20.     }
  21.     return $tag;
  22. }

代码版只是将 Async JavaScript 插件核心功能提取出来,原插件其实用起来更加方便,能兼容著名网页压缩插件:Autoptimize ,并具备部分调试功能。

WordPress异步加载JS代码版

[code]async[/code]属性是HTML 5新增的,只有在支持HTML 5的现代浏览器才会有效果,至于效果如何本人没实际测试过。

提示

需要说明的是:这个异步或推迟加载JS,并不会对网页实际打开速度产生影响,只是让网页内容在JS文件加载完之前,呈现给浏览者,让用户有个更好的体验,并不能真的提高网页加载速度。

 

 

本站文章大部分始于原创,用于个人学习记录,可能对您有所帮助,仅供参考!

weinxin
我的微信
版权声明
本站原创文章转载请注明文章出处及链接,谢谢合作!
 
知更鸟
评论  76  访客  75  作者  1
    • Win7en乐园
      Win7en乐园 7

      虽然我不知道异步加载是什么,也只是在百度统计,Google adsense里面见过,但是我感觉是个新技术,我也要学习。

        • 肉球
          肉球 4

          @ Win7en乐园 小婊砸,怎么又是你,丫的是不是天天监控着鸟叔的站

        • Win7en乐园
          Win7en乐园 7

          不管怎么说,鸟哥今天一口气发了三篇文章,已经让我感觉到很激动了,一口气学了三篇文章,一天没有白活。

          • Win7en乐园
            Win7en乐园 7

            鸟哥,一起努力,一起奋斗吧!!我还能有什么好说的呢。

            • 肉球
              肉球 4

              鸟叔带来了惊喜,加油,虽然我知道你一定不会回复,就是这么清高。嗯哼,我喜欢,但是还请鸟叔不要吝啬持续更新,我们跟着好好学习。

              • 动感单车
                动感单车 7

                个人觉得这个比插件好,咱就用这个方法了。

                  • Koolight
                    Koolight 4

                    @ 动感单车 用这个要设置好排除的js,不然可能会有副作用。

                  • 无作为
                    无作为 3

                    你博客最近出问题了,电脑端很多人打不开,手机可以.持续几天了,希望早日修复

                      • Zay
                        Zay 1

                        @ 无作为 电脑端打不开应该是因为你是联通的线路吧

                      • 无作为
                        无作为 3

                        还有能不能把你博客的评论功能教程分享一下,比如滑动验证和刷新页面重新编辑,还有可以自定义有邮件回复通知。

                        • 雅兮网
                          雅兮网 4

                          其实更希望是让某几个js异步加载

                          • 龙笑天
                            龙笑天 5

                            我就对几个js主动加了这个属性~~ :oops:

                            • 明月登楼的博客
                              明月登楼的博客 5

                              嗯,不错,我先在博客上试试!

                              • Win7en乐园
                                Win7en乐园 7

                                鸟哥,又是新的一天,新的一天应该有新的感悟,鸟哥把你的感悟写出来吧,大家一起学习。

                                • 随谈网
                                  随谈网 1

                                  都在学习拍马屁,我也要学学 :grin: :grin: :grin:

                                  • 励志语录
                                    励志语录 6

                                    学习了 :oops:

                                    • 6K影视
                                      6K影视 0

                                      不错,谢谢鸟叔的技术

                                      • Win7en乐园
                                        Win7en乐园 7

                                        鸟哥,又是新的一天!

                                        • 励志语录
                                          励志语录 6

                                          啊啊啊啊啊啊啊啊啊啊

                                          • 丁春华
                                            丁春华 2

                                            其实没辣么复杂,打个比方:原来js是单通道执行,现在可以多通道执行,js后台执行效率要高很多。 :oops:

                                            • Win7en乐园
                                              Win7en乐园 7

                                              鸟哥,更新网站啊。

                                              • 杭州牛牛工作室
                                                杭州牛牛工作室 4

                                                新的一天 大家一起学习

                                                • 励志语录
                                                  励志语录 6

                                                  新年快乐,拜年啦 :mrgreen:

                                                  • 杭州牛牛工作室
                                                    杭州牛牛工作室 4

                                                    值得一看

                                                    • 杭州牛牛工作室
                                                      杭州牛牛工作室 4

                                                      可以啊 我试过了 干货

                                                      • 简单生活
                                                        简单生活 3

                                                        很想卖,可做独立博客,三域名授权实在没用处,希望可以买套,单域名就可以了。可以的话联系我。大神

                                                        • 杭州牛牛工作室
                                                          杭州牛牛工作室 4

                                                          一起奋斗

                                                          • 不套路网赚
                                                            不套路网赚 0

                                                            纯干货分享,我不太喜欢弄代码插件之类,网站本身不快,弄了更卡

                                                            • 杭州牛牛工作室
                                                              杭州牛牛工作室 4

                                                              真正的干货

                                                              • 杭州牛牛工作室
                                                                杭州牛牛工作室 4

                                                                真心不错

                                                                • 杭州牛牛工作室
                                                                  杭州牛牛工作室 4

                                                                  站长更新哦

                                                                  • 杭州牛牛工作室
                                                                    杭州牛牛工作室 4

                                                                    不错 值得研究

                                                                    • 八零后
                                                                      八零后 2

                                                                      催更

                                                                      • 杭州牛牛工作室
                                                                        杭州牛牛工作室 4

                                                                        博主要更新哦

                                                                        • 何湘辉博客
                                                                          何湘辉博客 0

                                                                          不错学习了,博主的主题很火啊。

                                                                          • 夏日草博客
                                                                            夏日草博客 3

                                                                            异步最大的好处就是体验性很佳。

                                                                            • 杭州SEO优化
                                                                              杭州SEO优化 4

                                                                              可以啊

                                                                              • 杭州SEO优化
                                                                                杭州SEO优化 4

                                                                                支持 鸟哥

                                                                                • 杭州SEO优化
                                                                                  杭州SEO优化 4

                                                                                  很不错哦

                                                                                  • 腾蛙网
                                                                                    腾蛙网 3

                                                                                    好,有机会用下

                                                                                    • 诗梦
                                                                                      诗梦 2

                                                                                      这个插件可以和自带的用吗?

                                                                                      • 杭州SEO优化
                                                                                        杭州SEO优化 4

                                                                                        2017力挺鸟哥

                                                                                        • qiuzhang
                                                                                          qiuzhang 0

                                                                                          测试评论功能;

                                                                                          • 妙家居
                                                                                            妙家居 1

                                                                                            这个工具挺好用的,有点类似多线程

                                                                                            • VIP券网
                                                                                              VIP券网 1

                                                                                              很不错的网站,给大家分享推荐下。

                                                                                              • 杭州SEO优化
                                                                                                杭州SEO优化 4

                                                                                                永远支持鸟哥

                                                                                                • 杭州SEO优化
                                                                                                  杭州SEO优化 4

                                                                                                  支持鸟哥

                                                                                                  • 明月登楼的博客
                                                                                                    明月登楼的博客 5

                                                                                                    鸟哥,头像好像又挂了!

                                                                                                    • 杭州SEO优化
                                                                                                      杭州SEO优化 4

                                                                                                      JS代码太烦人了

                                                                                                      • 杭州SEO优化
                                                                                                        杭州SEO优化 4

                                                                                                        鸟哥要更新了哦

                                                                                                        • 爱魔方
                                                                                                          爱魔方 1

                                                                                                          好强大….

                                                                                                          • 杭州SEO优化
                                                                                                            杭州SEO优化 4

                                                                                                            鸟哥哪里去了

                                                                                                            • 华唯商标转让网
                                                                                                              华唯商标转让网 1

                                                                                                              学习学习下!

                                                                                                              • 杭州SEO优化
                                                                                                                杭州SEO优化 4

                                                                                                                来看看鸟哥

                                                                                                                • 华唯商标转让网
                                                                                                                  华唯商标转让网 1

                                                                                                                  进来看一看!

                                                                                                                  • Win7en乐园
                                                                                                                    Win7en乐园 7

                                                                                                                    什么也不说了,期待鸟哥的新文章。

                                                                                                                    • 产品帮
                                                                                                                      产品帮 0

                                                                                                                      不错

                                                                                                                      • 一夜涕
                                                                                                                        一夜涕 0

                                                                                                                        您好! 独立博客资源导航 blog.yiyeti.cc 已收录本站,将其收录到“大牛博客”分类下,特此告知!

                                                                                                                          • 殁漂遥
                                                                                                                            殁漂遥 4

                                                                                                                            @ 一夜涕 网站坚持做3年再说

                                                                                                                              • Win7en乐园
                                                                                                                                Win7en乐园 7

                                                                                                                                @ 殁漂遥 哈哈,你的网站很不错哦~我在用你的绿色版QQ,虽然是QQ超级会员,但是依旧有各种弹窗,唯独你的可以搞定这些垃圾广告。

                                                                                                                            • 杭州SEO优化
                                                                                                                              杭州SEO优化 4

                                                                                                                              鸟哥来更新哦 :???:

                                                                                                                              • Win7en乐园
                                                                                                                                Win7en乐园 7

                                                                                                                                鸟哥,爱你呦~~

                                                                                                                                • Win7en乐园
                                                                                                                                  Win7en乐园 7

                                                                                                                                  鸟哥的网站非常赞,但是最近不更新了呢?

                                                                                                                                  • 易淘金股票博客
                                                                                                                                    易淘金股票博客 3

                                                                                                                                    代码很实用 谢谢分享

                                                                                                                                    • 杭州SEO优化
                                                                                                                                      杭州SEO优化 4

                                                                                                                                      鸟哥失踪了吗

                                                                                                                                      • IT老剑
                                                                                                                                        IT老剑 0

                                                                                                                                        来学习学习,想加友链的点我哦 :grin: :grin: :grin:

                                                                                                                                        • 双折
                                                                                                                                          双折 0

                                                                                                                                          不错

                                                                                                                                          • 好店品
                                                                                                                                            好店品 4

                                                                                                                                            感觉速度网站速度很快啊,怎么优化的

                                                                                                                                            • 鳄鱼皮钱包
                                                                                                                                              鳄鱼皮钱包 1

                                                                                                                                              菜鸟哥看了

                                                                                                                                              • 投资那点事
                                                                                                                                                投资那点事 1

                                                                                                                                                代码很不错

                                                                                                                                              匿名

                                                                                                                                              发表评论

                                                                                                                                              匿名网友
                                                                                                                                              :?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

                                                                                                                                              拖动滑块以完成验证