Fatal编程技术网

如何加载外部javascript？

javascript jquery twitter-bootstrap

如何加载外部javascript？,javascript,jquery,twitter-bootstrap,Javascript,Jquery,Twitter Bootstrap,我正在浏览bootstrap站点，在那里他们提到了加载bootstrap的这个片段： 本质上，引导javascript和JQuery是在body标记之前加载的。这是加载任何外部javascript的推荐方法吗 是否存在必须在head标记中加载外部javascript的场景？因为我看到过很多这样的例子 这个google页面有自己的技术，可以在body标记之前加载javascript 引导101模板 你好，世界！ 您可以在HTML文档中放置任意数量的脚本 脚本可以放在HTML的正文或标题部分

我正在浏览bootstrap站点，在那里他们提到了加载bootstrap的这个片段：

  • 本质上，引导javascript和JQuery是在body标记之前加载的。这是加载任何外部javascript的推荐方法吗

  • 是否存在必须在
    head
    标记中加载外部javascript的场景？因为我看到过很多这样的例子

  • 这个google页面有自己的技术，可以在body标记之前加载javascript 

    • 
引导101模板
你好，世界！
    您可以在HTML文档中放置任意数量的脚本

    脚本可以放在HTML的正文或标题部分，和/或两者中

    通常，您会在网页的正文部分底部看到脚本。这可以缩短显示时间

    有时，您会在head部分中看到所有JavaScript函数

    无论如何，通过将所有代码放在一个地方来分离HTML和JavaScript始终是一个好习惯

    最好将脚本放在body元素的底部。 这提高了页面加载，因为HTML加载不会被脚本加载阻止。

    注意：您可以在头部或正文中随意放置外部脚本引用。脚本的行为就像它正好位于HTML文档中放置引用的位置一样。

    可以添加到文档中的任何位置，但添加所有资源（如
    JavaScript
    ，
    CSS
    ）通常是一种很好的做法，关闭
    之前的字体和其他资源

    你可以注意到

    1）所有元标记和文档呈现标记都位于顶部
    因为，浏览器首先正确呈现文档，元标记首先完成它们的工作。
    2）在元标记之后添加CSS
    因为，一旦呈现网页，它可能会看起来很好，因为在文档的前面加载了样式。
    3）在标题中的样式之后或在关闭
    标记之前加载脚本
    通常的做法是在关闭
    之前添加它们。但是一些开发人员（我也这样做）在关闭
    标记之前添加它们，以便所有样式和
    HTML
    都首先呈现，这样用户可以首先看到正确样式的页面，最后加载重载脚本。因此，页面将快速加载，而其他沉重的脚本将在最后加载。

    通常在页面完全加载后加载javascript文件。。因为任何最终用户都不想等待网页出现太长时间，所以要避免延迟加载的额外和长时间请求。内联jScript文件和小脚本包含在head标记中。Bootstrap还将js文件放在jquery.js之后的底部

    希望你明白我想说的话

    <!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bootstrap 101 Template</title>

    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
    <h1>Hello, world!</h1>

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>
  </body>
</html>