把JavaScript文件放在head中

标准方法是把JavaScript文件放到head标签内。

<head>
<script type="text/javascript" src="dreamdu.js"></script>
</head>
  • 如果浏览器不支持JavaScript,将忽略script标签里面的内容,可以避免使用<!-- ... //-->(内部引用)。
  • 当JavaScript有任何HTML实体时,也不需要使用CDATA标签了(因为JavaScript代码不直接在HTML文件中)。
  • JavaScript文件必须使用js为文件后缀。

把JavaScript文件放在body前

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

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

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

JavaScript文件的内容

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

document.write("www.dreamdu.com");
document.write("梦之都");

JavaScript文件外部加载的好处

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

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

  • 不要把JavaScript分为多个文件,多个文件会增加服务器的负担,增加服务器的HTTP请求。
  • 一个JavaScript文件也会增大HTTP请求。
  • 为什么有些网站的JavaScript文件后面有一串数字?比如:
<script type="text/javascript" src="dreamdu.js?1217128319"></script>

HTML-HTML链接JavaScript的几种方法的更多相关文章

  1. Javascript创建对象几种方法解析

    Javascript创建对象几种方法解析 Javascript面向对象编程一直是面试中的重点,将自己的理解整理如下,主要参考<Javascript高级程序设计 第三版>,欢迎批评指正. 通 ...

  2. ASP.NET,C#后台调用前台javascript的五种方法

    C#后台调用前台javascript的五种方法 由于项目需要,用到其他项目组用VC开发的组件,在web后台代码无法访问这个组件,所以只好通过后台调用前台的javascript,从而操作这个组件.在网上 ...

  3. 创建JAVASCRIPT对象3种方法

    创建JAVASCRIPT对象3种方法 方法一:直接定义并创建对象实例 var obj = new Object();    //创建对象实例 //添加属性obj.num = 5;   //添加属性 o ...

  4. VC调用javascript的几种方法

    第一种:通过execScript调用.这种方法,虽然操作方便,但不能获取返回值.m_spHtmlDoc->get_parentWindow(&m_pHtmlWindow);VARIANT ...

  5. C#后台调用前台javascript的五种方法小结

    第一种,OnClientClick (vs2003不支持这个方法) <asp:Button ID="Button1" runat="server" Tex ...

  6. 【转】 C#后台调用前台javascript的五种方法

    第一种,OnClientClick    (vs2003不支持这个方法)<asp:ButtonID="Button1" runat="server" Te ...

  7. 断开/删除 SVN 链接(.svn)的几种方法

    上传到正式的服务器时需要去掉这些不必要的文件,找到了几种方法: 1.windows下: xcopy project_dir project_dir_1 /s /i (从project_dir 复制文件 ...

  8. 黄聪:WordPress固定链接设置的几种方法

    wordpress固定链接设置的一些参数: %year%:基于文章发布的年份,比如2010: %monthnum%:基于文章发布的月份,比如01: %day%:基于文章发布当日,比如06: %hour ...

  9. WordPress固定链接设置的几种方法(推荐/%post_id%.html)

    传说中,固定链接有SEO功能,今天试了试,现在给大家分享一下: wordpress固定链接设置技巧: 1.不要让日期出现在固定链接里面 这基于两个方面的考虑.一是如果数字出现在固定链接里面,等于提醒搜 ...

随机推荐

  1. iOS 仿支付宝密码支付

    代码地址如下:http://www.demodashi.com/demo/11484.html 一.准备工作 xcode 主要实现输入密码的时候不可见 二.程序实现 实现思路怎样 在支付宝输入密码的时 ...

  2. JavaScript入门:002—JS代码放置的位置

    JavaScript在页面中使用,那么这些JS代码应该放在什么位置呢?以下来看一下. 一般来说有两种方式.写在界面上和使用.js文件.1.1界面上的Head部分能够直接放在head标签内,例如以下代码 ...

  3. 【小程序】微信小程序开发—弹出框

    1. <span style="font-family:Comic Sans MS;font-size:18px;color:#333333;"><view cl ...

  4. 安装Drupal7.12升级至7.22

    怀揣着为中小企业量身定做一整套开源软件解决方案的梦想开始了一个网站的搭建.http://osssme.org/ [2013-08-11] 资料更新,Drupal 7.22升级至7.23 访问自己的Dr ...

  5. Android实现换肤功能(一)

    上周有个朋友给建议说讲讲换肤吧,真巧这周公司的工作安排也有这个需求,换的地方之多之繁,让人伤神死了.正所谓磨刀不误砍柴工,先磨下刀,抽出一个工具类,写了个关于换肤的简单demo. Android中换肤 ...

  6. Bootstrap学习 进度条

    本文将介绍Bootstrap进度条,在本文中你将看到如何使用Bootstrap创建加载,重定向或动作状态的进度条 bootstrap进度条使用CSS3过渡和动画来获得该效果.Internet Expl ...

  7. AssionShop开源B2C电子商务系统-(一)用例图(转载)

    这篇文章,将有实质的进展.先把大体的需求整理了一份用例图,自认为粒度做的已经很细了,再细就没法搞了.我还是坚信一个原则:自己业余搞的东西千万不要 想一口吃个胖子,这样很容易项目就搞流产了~,废话不多说 ...

  8. Centos系统安装JDK详细图文教程

    1.查询系统默认JDK Centos系统默认会安装OpenJDK,一般建议是安装sun公司的JDK.我们首先检查系统是否安装有jdk并且是OpenJDK版本的,若是,则将它卸载掉并安装上sun公司的j ...

  9. Atitit. 衡量项目规模 ----包含的类的数量 .net java类库包含多少类 多少个api方法??

    Atitit. 衡量项目规模 ----包含的类的数量 .net java类库包含多少类 多少个api方法?? 1 framework 4.5 (10万个api)1 2 Jdk8   57M1 3 Gi ...

  10. Tomcat 学习进阶历程之Tomcat架构与核心类分析

    前面的http及socket两部分内容,主要是为了后面看Tomcat源代码而学习的一些网络基础.从这章開始.就開始实际深入到Tomcat的'内在'去看一看. 在分析Tomcat的源代码之前,准备先看一 ...