WordPress异步加载JS代码版

本文介绍了在WordPress中异步加载JavaScript的代码方法,无需使用插件。通过将提供的PHP代码添加到主题的functions.php文件中,可实现异步或延迟加载JS,提升用户体验。但需注意,该方法不影响实际加载速度,仅优化内容呈现,且依赖现代浏览器支持。

WordPress基础教程
阅读时间: 4 分钟
最后更新时间:2025年11月13日

上篇 《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文件加载完之前,呈现给浏览者,让用户有个更好的体验,并不能真的提高网页加载速度。

这篇文章有用吗?

点击星号为它评分!

平均评分 0 / 5. 投票数: 0

到目前为止还没有投票!成为第一位评论此文章。

小兽wordpress

小兽wordpress

技术负责人
小兽wordpress凭借多年的wordpress企业主题制作经验,坚持以“为用户而生的wordpress主题”为宗旨,累计为10万多家客户提供品质wordpress建站服务,得到了客户的一致好评。我们一直用心对待每一个客户,我们坚信:“善待客户,将会成为终身客户”。小兽wordpress能坚持多年,是因为我们一直诚信。

相关文章

如何让线上业务更上一层楼

还没有WordPress网站

还没有WordPress网站

不管你从事什么行业,WordPress都会为你提供一个专业的主题模板。在WordPress市场上有成千上万的免费主题,适合很多中小企业。

查看所有模板
已经有WordPress网站

已经有WordPress网站

小兽WordPress诚邀你一起学习WordPress,愿与各方携手升级改善您的WordPress网站,一起交流网站加速,网站优化等问题。

马上交个朋友
微信联系
chat 扫码联系
模板建站
挑选模板
网站定制
免费诊断
咨询热线
咨询热线

189-0733-7671

返回顶部