wordpress把JavaScript files 移动到HTML文档底部

为了提高你的WordPress博客的加载速度,建议您将JavaScript文件移动到HTML文档底部。但是，很多插件在必须加装在文档的头部，我们强制移动底部，会出现插件失效，这是一个简单的解决方案来自动将所有JavaScript文件移动到文档的底部，从而提高网页的加载速度，如果你在进行wp主题的开发，这对你的主题加载效率有很大帮助。

首页，把以下代码复制到 functions.php文件中

/**
 * Filter HTML code and leave allowed/disallowed tags only
 *
 * @param string 	$text 	Input HTML code.
 * @param string 	$tags 	Filtered tags.
 * @param bool 		$invert Define whether should leave or remove tags.
 * @return string Filtered tags
 */
function theme_strip_tags_content($text, $tags = '', $invert = false) {

    preg_match_all( '/<(.+?)[\s]*\/?[\s]*>/si', trim( $tags ), $tags );
    $tags = array_unique( $tags[1] );

    if ( is_array( $tags ) AND count( $tags ) > 0 ) {
        if ( false == $invert ) {
            return preg_replace( '@<(?!(?:'. implode( '|', $tags ) .')\b)(\w+)\b.*?>.*?@si', '', $text );
        }
        else {
            return preg_replace( '@<('. implode( '|', $tags ) .')\b.*?>.*?@si', '', $text );
        }
    }
    elseif ( false == $invert ) {
        return preg_replace( '@<(\w+)\b.*?>.*?@si', '', $text );
    }

    return $text;
}

/**
 * Generate script tags from given source code
 *
 * @param string $source HTML code.
 * @return string Filtered HTML code with script tags only
 */
function theme_insert_js($source) {

    $out = '';

    $fragment = new DOMDocument();
    $fragment->loadHTML( $source );

    $xp = new DOMXPath( $fragment );
    $result = $xp->query( '//script' );

    $scripts = array();
    $scripts_src = array();
    foreach ( $result as $key => $el ) {
        $src = $result->item( $key )->attributes->getNamedItem( 'src' )->value;
        if ( ! empty( $src ) ) {
            $scripts_src[] = $src;
        } else {
            $type = $result->item( $key )->attributes->getNamedItem( 'type' )->value;
            if ( empty( $type ) ) {
                $type = 'text/javascript';
            }

            $scripts[$type][] = $el->nodeValue;
        }
    }

    //used by inline code and rich snippets type like application/ld+json
    foreach ( $scripts as $key => $value ) {
        $out .= '';
    }

    //external script
    foreach ( $scripts_src as $value ) {
        $out .= '';
    }

    return $out;
}

其次 编辑 header.php 文件， 移除 wp_head()函数

<?php
ob_start();
wp_head();
$themeHead = ob_get_contents();
ob_end_clean();
define( 'HEAD_CONTENT', $themeHead );
 
$allowedTags = '<style><link><meta><title>';
print theme_strip_tags_content( HEAD_CONTENT, $allowedTags );
?>

最后把以下代码放到 footer.php 文件的 </body> 前

<?php theme_insert_js( HEAD_CONTENT ); ?>

有关wordpress加载Js，建议阅读：WordPress引入css/js两种方法

您可能感兴趣的文章:

---

▪ wordpress网站标题动态优化的几种形式

▪ WordPress免插件实现面包屑导航

▪ Wordpress基于bootstrap自适应主题制作

▪ 第九课WordPress主题制作自定义顶部图像

▪ wordpress修改上传文件默认类型

▪ 第一课：511遇见wordpress本地环境搭建以及多站点配置

▪ WordPress评论中插入图片

▪ WordPress 3D旋转彩色标签云

▪ wordpress限制非管理员访问管理面板

▪ Wordpress无插件实现主题彩色标签云的N种方法总