JavaScript 笔记(7) -- 在HTML中嵌入 js （外部引用）

本节主要说明，在HTML中嵌入自定义 JavaScript。通过HTML的script标签加载JavaScript文件

• 为防止网页加载缓慢，也可以把非关键的JavaScript放到网页底部，例如下面的代码。

         <script type="text/javascript" src="dreamdu.js"></script>
      </body>
  </html>

  通常JavaScript文件可以使用script标签加载到网页的任何一个地方，但是标准的方式是加载在head标签内。

• JavaScript文件可以包含任何的JavaScript代码，比如dreamdu.js文件中

  document.write("www.dreamdu.com");
  document.write("梦之都");
  function jsTest(){   
  /* 该函数可以在 其他的 JS 文件中直接访问;
     访问方式与定义在同个文件中的访问方式相同，eg：jsTest();  
     但需记得在其他 JS 引用时，必须将该文件放在引用它的文件前面。比如：dreamdu2.js 中使用了dreamdu.js 中的 jsTest() 函数，则必须先加载 dreamdu.js（放上面），后加载 dreamdu2.js（放下面）*/
  　　alert("测试自定义 JS 的 function 部分");
     console.log("测试自定义 JS 的 function 部分");
  }

• JavaScript文件外部加载的好处

  • 避免使用<!-- ... //-->，骇客技术。
  • 避免使用CDATA。
  • 统一定义JavaScript代码，方便查看，方便维护。
  • 使代码更安全，可以压缩，加密单个JavaScript文件。
  • 浏览器可以缓存JavaScript文件，减少宽带使用（当多个页面同时使用一个JavaScript文件的时候，通常只需下载一次）。

• JavaScript文件外部加载的注意事项

  • 不要把JavaScript分为多个文件，多个文件会增加服务器的负担，增加服务器的HTTP请求。
  • 一个JavaScript文件也会增大HTTP请求。
  • 为什么有些网站的JavaScript文件后面有一串数字？比如:

<scripttype="text/javascript"src="dreamdu.js?1217128319"></script>

    有两种可能:

• • JavaScript文件更新后，此版本将增加或改变，浏览器会因此判断这是一个新的JavaScript文件，从而更新缓存中以前的JavaScript文件。
  • 这个JavaScript文件是由应用程序生成的因此带有版本，便于管理。