跳转到主要内容

7.3 Js的加载顺序

在Drupal中引入JS的时候,你可以用表示权重的“group”来控制JS在页面上的载入顺序,以下是你可以在"group"中使用的常数:

JS_LIBRARY: JS库,设置(settings),jQuery插件

JS_DEFAULT:模块层JS

JS_THEME: 模版层JS

Drupal页面加载JS的顺序是:先加载JS_LIBRARY,然后加载JS_DEFAULT,最后是JS_THEME。

当你使用drupal_add_js引入JS的时候,你可以使用类似下面的代码来控制JS的加载顺序:

这里的scope是一个更加重要的东西,他有两个值一个是header一个是footer,而且默认值是header。

顾名思义,它们的作用是用来指定你的JS代码是放在页面顶部还是底部的。

我们在讨论前端性能的时候曾经说过,将JS代码放在页面底部是常见的优化性能的做法——这也是Google Speed的推荐方式。因此如果你使用drupal_add_js添加JS代码,一定不要忘记把scope的值设置为footer,至少如果你不这么做的话,应该知道原因。因为如果你不设置的话,它就跑到页面顶部去了。

让我们再来看一下核心中的html.tpl.php文件,这个文件是Drupal的模版层输出页面JS代码的源头。

你可以看到代码中的第53行高亮显示的内容,就是将JS输出到页面head部位的代码。 而代码中的第61行高亮显示的内容,就是将JS输出到页面底部的代码。我自己通常的做法是把第53行直接放到61行的上面,当然,没有人告诉我这样对不对,也许是错的,我不负责哦。

关于这个问题,还有更多的Drupaler在D.O.上讨论,大家可以自己去看看。点击传送门