如何在head标签中注册jQuery资产

我不熟悉Yii2资产包。Yii2资产包在页面顶部注册css文件，在页面底部注册js文件。但是我怎么能在页面顶部也包含那些js文件呢？

class AppAsset extends yiiwebAssetBundle
{
    public $basePath = '@webroot';
    public $baseUrl = '@web';
    public $depends = [
        'yiiwebYiiAsset',
        'yiibootstrapBootstrapAsset',
    ];
}

我只需要在页面顶部注册所有的js和css文件。使用AppAsset是否可行？

编辑

默认注册脚本

<head>
....
<link href="/assets/4850c11c/css/bootstrap.css" rel="stylesheet">
....
</head>
<body>
.....
<script src="/assets/76016e7c/jquery.js"></script>
.....
</body>

我只需要

<head>
....
<link href="/assets/4850c11c/css/bootstrap.css" rel="stylesheet">
<script src="/assets/76016e7c/jquery.js"></script>
....
</head>

只需在bundle类中添加一行即可。

public $jsOptions = ['position' => yiiwebView::POS_HEAD];

你的代码会是这样的：

class AppAsset extends yiiwebAssetBundle
{
    public $basePath = '@webroot';
    public $baseUrl = '@web';
    public $jsOptions = ['position' => yiiwebView::POS_HEAD];
    public $depends = [
        'yiiwebYiiAsset',
        'yiibootstrapBootstrapAsset',
    ];
    public $js = [
        'somefile.js'
    ];
}

或者，您也可以使用配置数组而不是字符串在头部分中仅指定所需的文件（警告：第一个元素必须是文件名）。

class AppAsset extends yiiwebAssetBundle
{
    public $basePath = '@webroot';
    public $baseUrl = '@web';
    public $depends = [
        'yiiwebYiiAsset',
        'yiibootstrapBootstrapAsset',
    ];
    public $js = [
        'this_file_will_be_at_end.js', // The default position
        ['but_this_will_be_at_header.js', 'position' => yiiwebView::POS_HEAD],
        ['and_this_too.js', 'position' => yiiwebView::POS_HEAD]
    ];
}

要在页面的头部包含JavaScript文件（默认情况下，JavaScript文件包含在正文部分的末尾），请使用以下选项：

 public $jsOptions = ['position' => yiiwebView::POS_HEAD];

或直接进入视野

 $this->registerJs('js/myjsfile.js', $this::POS_HEAD);

你可以看到http://www.yiiframework.com/doc-2.0/guide-output-client-scripts.html

http://www.yiiframework.com/doc-2.0/guide-structure-assets.html

相关内容

最新更新

热门标签：