WordPress异步加载JS代码版

所属分类：WordPress

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

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

// 异步加载JS
add_filter( 'script_loader_tag', 'async_script', 10, 3 );
function async_script( $tag, $handle, $src ) {
$zm_method = 'async';// 可将“async”改为“defer”
$zm_exclusions = 'jquery.min.js,script.js';// 排除的JS
$array_exclusions = !empty( $zm_exclusions ) ? explode( ',', $zm_exclusions ) : array();
if ( false !== $zm_enabled && false === is_admin() ) {
if ( !empty( $array_exclusions ) ) {
foreach ( $array_exclusions as $exclusion ) {
$exclusion = trim( $exclusion );
if ( $exclusion != '' ) {
if ( false !== strpos( strtolower( $src ), strtolower( $exclusion ) ) ) {
return $tag;
}
}
}
}
$tag = str_replace( 'src=', $zm_method . "='" . $zm_method . "' src=", $tag );
return $tag;
}
return $tag;
}

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

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

提示

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

我的微信

分享交流WordPress经验与技巧，关注前端设计与网站制作。仅用于功能演示。

目前评论：73 其中：访客 72 博主 1