如何在 Joomla 中使用 headjs？答案

【问题标题】：How to use headjs with Joomla?如何在 Joomla 中使用 headjs？
【发布时间】：2011-11-07 16:17:41
【问题描述】：

尝试在 Joomla 中使用 HeadJS。我在我的模板中添加了一个代码 - 它获取头输出中的 javascript 文件，准备一个字符串以在 head.js 代码之间输出它们，然后从 joomla 的头输出标签中删除所有 javascript 文件。

问题是在模板之后加载了一些脚本。例如，一个模块将在模板加载后将一些脚本文件排入队列，因此它的文件出现在我的 head.js 代码之外。有什么想法可以控制吗？

$data = $this->getHeadData();

if( $data['scripts'] ){
    foreach ($data['scripts'] as $url=>$type){
        if( !strstr($url, 'ajax.googleapis.com/ajax/libs/jquery') )
        $headjs[] = $url;
    }
    unset( $data['scripts'] );
    $data['scripts'][$template . '/js/head.js'] = array(
        'mime' => 'text/javascript',
        'defer' => false,
        'async' => false);
    $this->setHeadData($data);
}

然后……

 <script>
        head.js(
        <? foreach($headjs as $script): ?>
            '<?=$script?>',
        <? endforeach; ?>
            function(){
            }
        );
    </script>

【问题讨论】：

标签： joomla joomla-extensions joomla-template joomla1.7 head.js

【解决方案1】：

不同的扩展可以连接到在处理输出期间触发的不同事件（即使在模板被渲染之后）。

到目前为止，我发现的最佳选择是创建系统插件并将其移动到最后一个可用的系统插件。

现在你有两个选择：

使用onBeforeCompileHead 事件（我猜是引入Joomla 1.5.23）将脚本移动到headjs。
使用 onAfterRender 事件并解析 head html 代码，以便使用 headjs 加载它。

如果您在完全控制网站的情况下使用异步脚本加载，这很好，但几乎不可能实现为 Joomla 的通用扩展。一些扩展在头部使用内联脚本，一些在 html 正文中，您必须保留执行顺序（简单示例：Mootools 必须首先加载）。

我过去只异步加载我自己包含的那些脚本（在我的模板或我的扩展中）。使用 Joomla 核心（Mootools、core.js 等）或其他我不涉及的扩展添加的任何脚本。

【讨论】：