How does yii2 load css and js at the bottom of the page? How does yii2 load cssjs_PHP?

Yii2 loads css and js at the bottom of the page, and yii2 loads cssjs. How does yii2 load css and js at the bottom of the page? How does yii2 load cssjs? author: White Wolf Source: www. manks. toparticle ii2_load_js_css_in_end this article is copyrighted by the Author. You are welcome to repost it. However, without the author yii2, how can I load css and js at the bottom of the page, and yii2 load cssjs?

Author: White Wolf Source: www. manks. top/article/yii2_load_js_css_in_end

The copyright of this article belongs to the Author. You are welcome to repost this article, but you must keep this statement without the author's consent and provide the original article connection clearly on the article page. Otherwise, you will be entitled to pursue legal liability.

Just because our lives are made by ourselves and are born by our hearts, how are our problems thrown out?

This is also a long but frequently asked question. The reason is,

One is inevitable in actual development, and the other is that the friends who are new to yii like to stick to it. That

Why don't people who have understood this problem get stuck? Aliens.

That's all about people.

Generally, js files or code inside a webpage are placed at the bottom of the webpage.Before, this is because the web page is loaded from top to bottom. when users access our pages, do not load javascript to display blank pages that are too long. if the stay is too long, the number of users will be lost.

Yii2 integrates jQuery and the jQuery file is loaded at the bottom of the page. Therefore, if our js code segment is not loaded at the bottom of the page, A friendly prompt of $ undefined may occur.

I have a lot of bad things. I really need to check out a number...

Let's take a look at how to handle js code segments.

 RegisterJs ('$ (function () {// write the js code you want to write whatever you want $ ......}); ', \ yii \ web \ View: POS_END );

Yes, it is to use the above registerJs method for registration. some friends don't understand it. what is registration? a simple understanding is to place your js code on the page you want to place.

The first parameter is the js code block to be written. The second parameter is that we need to specify the specific location where the code block is inserted on the page.

The second parameter is discussed here only in \ yii \ web \ View: POS_END, which means the bottom of the page.Previously inserted.

Of course, there is a third parameter, which indicates an id of the js code block. If this parameter is not specified, it will be generated by default. this parameter is ignored here.

By the way, do not confuse the above $ this. here it refers to the yii \ web \ View object.

Next let's take a look at how to introduce external js files.

The example on the official website is as follows:

$this->registerJsFile('http://example.com/js/main.js', ['depends' => [\yii\web\JqueryAsset::className()]]);

But people have said that we do not recommend such use, so dependency is complicated.

Okay. let's see how to use the package management asset bundles for registration.

Open the file backend \ assets \ AppAsset first. the PHP file looked at the tall stuff. I wiped it and it was really advanced. I couldn't understand it at all. I couldn't write it below. I couldn't understand how to explain it. back to the question, we need to extend it quickly.

We added two static methods to the AppAsset class. The full version of the AppAsset class is as follows:

Namespace backend \ assets; use yii \ web \ AssetBundle;/*** @ author Qiang Xue
 
  
* @ Since 2.0 */class AppAsset extends AssetBundle {public $ basePath = '@ webroot'; public $ baseUrl =' @ web '; public $ css = ['css/site.css ',]; public $ js = []; public $ depends = ['yii \ web \ yiiasset ', 'yii \ bootstrap \ bootstrapasset',];
  
// Define the JS method to be loaded as needed. pay attention to the loading order in the final public static function addScript ($ view, $ jsfile) {$ view-> registerJsFile ($ jsfile, [AppAsset :: className (), 'desc' => 'backend \ assets \ appasset']);} // defines the on-demand loading css method, note that the loading sequence is in the final public static function addCss ($ view, $ cssfile) {$ view-> registerCssFile ($ cssfile, [AppAsset: className (), 'desc' => 'backend \ assets \ appasset']);}
 

Let's talk about what the addScript and addCss functions and the intention are. as mentioned above, we do not recommend that you directly use the $ this-> registerJsFile method in the view layer to register a file. here, the addScript method we added. later, the view layer will directly call this method to register the file.

So why is that? The advantage is very obvious. calling this method avoids entering dependencies in every registration file, which is very convenient.

It should be noted that all the files to be registered will be behind the yii. js and bootstrap. js files, which is exactly what we need.

In this way, loading external js files on The view layer is quite simple, as shown below,

use backend\assets\AppAsset;AppAsset::register($this);AppAsset::addScript($this,'/css/main.js');

It does not have to be as tedious as follows:

$this->registerJsFile('/css/main.js',['depends'=>['backend\assets\AppAsset'], 'position'=> $this::POS_END]);$this->registerJsFile('/css/left.js',['depends'=>['backend\assets\AppAsset']]);$this->registerJsFile('/css/extension.js',['depends'=>['backend\assets\AppAsset']]);

By now, we have fully implemented loading css, js code, or external files at the bottom of the page in yii2.

For more details, refer to the official documentation.

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

Http://www.yiiframework.com/doc-2.0/guide-output-client-scripts.html

Http://www.bkjia.com/PHPjc/1122393.htmlwww.bkjia.comtruehttp://www.bkjia.com/PHPjc/1122393.htmlTechArticleyii2 how to load css and js at the bottom of the page, yii2 load cssjs author: White Wolf Source: www. manks. top/article/yii2_load_js_css_in_end the copyright of this article belongs to the Author. You are welcome to reprint it, but it is not prepared by the author...