如何确保javascript是在翡翠模板的代码的底部

How to ensure the javascript is at the bottom of the code in Jade template?

本文关键字：代码 底部 何确保 确保 javascript      更新时间：2023-09-26

我是新手。jade:

html
  head
    meta(charset='UTF-8')
    title MyApplication
    meta(content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no', name='viewport')
    link(href='/bootstrap/dist/css//bootstrap.min.css', rel='stylesheet', type='text/css')
  body
    block content
script(src='http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js')
script(src='/bootstrap/dist/js/bootstrap.min.js', type='text/javascript')
如您所见，在模板文件的末尾有两个javascript。我的另一个玉文件，家。玉: 
extends layout
block content
        // Content Header (Page header)
        section.content-header
          h1= title
        // Main content
        section.content
script(type='text/javascript').
  $(function() {
     alert('here!');
  }

与该文件相关的javascript位于文件末尾。不幸的是，块内容嵌入在布局中。使这里的脚本在jQuery之前加载。代码永远不会被调用。有什么方法来解决这个问题，以确保javascript在jQuery之后加载?由于

您可以在布局中定义更多的块来填充。您甚至可以为块定义默认值:参见http://jade-lang.com/reference/extends/

layout.jade: 

html
  head
    meta(charset='UTF-8')
    title MyApplication
    meta(content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no', name='viewport')
    link(href='/bootstrap/dist/css//bootstrap.min.css', rel='stylesheet', type='text/css')
  body
    block content
    script(src='http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js')
    script(src='/bootstrap/dist/js/bootstrap.min.js', type='text/javascript')
    block script

home.jade: 

extends layout
block content
        // Content Header (Page header)
        section.content-header
          h1= title
        // Main content
        section.content
block script
    script(type='text/javascript').
      $(function() {
        alert('here!');
      }

这将分别渲染你的内容、js库和脚本。

在布局。

相关文章：