Yii2 page Bottom loading css and JS tips _php Example

In general, the page inside the JS file or code, are placed at the bottom of the pageIn front, this is because the page load from top to bottom, the user in the visit to our page as far as possible not because of the loading JS show too long blank page, stay too long on the loss of the amount of users.

YII2 is integrated with jquery, and the jquery file is loaded at the bottom of the page, so if our JS snippet does not load at the bottom of the page, it is very likely that an undefined friendly hint will occur.

I really need to hang a number to see the problem of a lot of nonsense ...

Let's take a look at how JS code snippet handles

<?php$this->registerjs (' $ ' (function () {//) write the JS code you want to write the $ ...}); ', \yii\web\view::P os_end);

Yes, is to use the above Registerjs method registration, there are small partners do not understand, what is registered, simple to understand is to put your JS code in the page you want to place.

The first parameter, well understood, is the JS code block we are going to write. The second parameter is that we need to specify the code block to be inserted in the specific location of the page.

The second parameter is discussed here only \yii\web\view::P os_end, meaning that is inserted before the bottom of the page.

Of course there is a third parameter, which means that the JS code block of an ID, not specified by default generated, ignored here.

Oh yes, don't confuse the $this above, this refers to the Yii\web\view object

Next look at how to introduce the external JS file.

This is the case for the official website.

But it is said that we do not recommend such use, so rely on to rely on the complexity of the relationship.

Well, let's see how to register with package management asset bundles.

We first open the file backend\assets\appasset.php file to see what is tall on the thing, I rub, really advanced, I coupon completely do not understand the look, finished, the following can not write, do not understand how to say, return to the point, we have to seize the time to expand.

We have added two static methods to the Appasset class, and 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 exten DS assetbundle{Public  $basePath = ' @webroot ';  Public $baseUrl = ' @web ';  Public $css = [    ' Css/site.css ',  ];  Public $JS = [  ];  Public $depends = [    ' Yii\web\yiiasset ',    ' Yii\bootstrap\bootstrapasset ',  ];  Define the on-demand load JS method, note the load order in the last public   static function Addscript ($view, $jsfile) {     $view->registerjsfile ($ Jsfile, [Appasset::classname (), ' depends ' = ' backend\assets\appasset ']);   Define on-demand loading of CSS methods, note the load order in the last public   static function Addcss ($view, $cssfile) {     $view->registercssfile ($ Cssfile, [Appasset::classname (), ' depends ' = ' backend\assets\appasset ']);   }
 
  

We first say add addscript and addcss have what role, intention is what, above said, do not recommend in the view layer directly with $this->registerjsfile method register file, here, we add Addscript method, Later, the view layer calls this method directly to register the file.

Then why is this so good? The benefit is very obvious, it is very convenient to call this method to avoid having to fill in dependencies for each registration file.

It is necessary to note that the files that need to be registered will be behind the yii.js and Bootstrap.js files, which is exactly what we need.

In this way, we load the external JS file in the view layer is often simple, like the following,

Use Backend\assets\appasset; Appasset::register ($this); Appasset::addscript ($this, '/css/main.js ');

It doesn't have to be as tedious as the following:

$this->registerjsfile ('/css/main.js ', [' Depends ' =>[' backend\assets\appasset '], ' position ' = $this::P os_ END]), $this->registerjsfile ('/css/left.js ', [' Depends ' =>[' backend\assets\appasset ']); $this Registerjsfile ('/css/extension.js ', [' Depends ' =>[' backend\assets\appasset ']);

To this, we complete the implementation of the YII2 in the bottom of the page load CSS,JS code or external files.

The above is a small series to introduce you to the bottom of the Yii2 page loading CSS and JS skills related content, I hope you have some help!

