yii中引入js和css檔案

http://zccst.iteye.com/blog/1329741

四、在視圖層（../views/..）添加CSS檔案或JavaScript檔案

Php代碼  

1. Yii::app()->clientScript->registerScriptFile(Yii::app()->baseUrl . "/js/TableView.js");  
2. Yii::app()->clientScript->registerScriptFile(Yii::app()->baseUrl . "/js/datechooser.js");  
3. Yii::app()->clientScript->registerCssFile(Yii::app()->baseUrl . "/css/datechooser.css");  

批注1：在視圖層引用與在控制層引用的方式一樣。但在視圖層中引用加載的要晚一些。

批注2：引用路徑是使用baseUrl，而不是basePath。

批注3：關于參數CClientScript::POS_END，作用是延時加載，提高頁面渲染效率。例如：

Yii::app()->clientScript->registerScriptFile(Yii::app()->baseUrl . "/js/jqueryui/jquery-ui.min.js", CClientScript::POS_END);

全部參數一覽：

CClientScript::POS_HEAD : the script is inserted in the head section right before the title element.

CClientScript::POS_BEGIN : the script is inserted at the beginning of the body section.

CClientScript::POS_END : the script is inserted at the end of the body section.

CClientScript::POS_LOAD : the script is inserted in the window.onload() function.

CClientScript::POS_READY : the script is inserted in the jQuery's ready function.

注：這些參數僅适用于加載js檔案，不适用于加載css檔案。

三、引入jquery核心部件

Php代碼  

1. Yii::app()->clientScript->registerCoreScript('jquery');  

批注：不論在頁面中的何種位置引用，最終yii會将jquery.js檔案放入yii的assets檔案夾下。即/projectName/assets/82qg58/jquery-1.6.1.min.js。

二、在控制層(../controllers/xxController.php)添加CSS檔案或JavaScript檔案

Php代碼  

1. public function init()  
2. {     
3.     //parent::init();     
4.     Yii::app()->clientScript->registerCssFile(Yii::app()->baseUrl.'/css/my.css');  
5.     Yii::app()->clientScript->registerScriptFile(Yii::app()->baseUrl.'/css/my.js');  
6. }  

新增：

在控制層，還可以在ActionIndex中引入，而且還可以引入别的module檔案夾中的js/css檔案。甚至是任意檔案夾下的js/css檔案

Php代碼  

1. public function actionIndex(){  
2.         $modify,$reg = some_value;  
3.         $js = $this->renderFile($this->getInstallViewPath(). '/asset/install.js',array('reg_mp'=>$reg), true);  
4.         $js = $this->renderFile($this->getViewPath() . '/assets/install_params.js', array('modify' => $modify), true);  
5.         $cs = Yii::app()->clientScript;  
6.         $cs->registerScript('asset/install', $js, CClientScript::POS_END);  
7.         $cs->registerCssFile(Yii::app()->baseUrl . '/css/launch_feed.css');  
8.         $cs->registerScript('assets/install_params',$js,CClientScript::POS_END);  
9.         $cs->registerScriptFile(Yii::app()->baseUrl . '/resources/jquery.form.js');  
10.         $cs->registerCssFile(Yii::app()->baseUrl . '/css/install_params.css');  
11.         $this->render('xxx');      
12.     }  
13. public function getInstallViewPath() {  
14.         return $this->getModule()->getBasePath().'/../operations/views';  
15. }    

一、在../layouts/main.php中引入

1，直接引入

Html代碼  

1. <!-- css -->  
2. <link rel="stylesheet" type="text/css" href="<?php echo Yii::app()->request->baseUrl; ?>/css/print.css" media="print" />  
3. <!-- 圖檔 -->  
4. <link rel="stylesheet" type="text/css" href="<?php echo Yii::app()->request->baseUrl; ?>/js/autocomplete/indicator.gif" />  
5. <!-- js -->  
6. <script type="text/javascript" src="<?php echo Yii::app()->request->baseUrl; ?>/js/jquery.js"></script>  

2，yii方式引入

Html代碼  

1. <?php  
2. <!-- （一）簡單用法 -->  
3. <!-- js -->  
4.     Yii::app()->clientScript->registerScriptFile(Yii::app()->baseUrl . "/js/jqueryui/jquery-ui.min.js", CClientScript::POS_END);  
5. <!-- （二）複雜用法 -->  
6. if($this->user->id) {  
7.         Yii::app()->clientScript->registerScriptFile(Yii::app()->createUrl('/account/info', array('format' => 'js')), CClientScript::POS_END);  
8.     }  
9.     if($this->user->id) {  
10.         Yii::app()->clientScript->registerScriptFile(Yii::app()->createUrl('site/baseJs'));  
11.     }  
12. ?>  

批注：在yii運作後，第一種在head中，第二種在body最後面，顯然後者效率更高。但必須加載的js和css有必要寫在head中。

3，差別

批注：至于為什麼會有/assets/b729ab/js/jquery.js這樣的檔案生成，還在繼續探索中。