一、HTML 页面的 <head> 部分中
　　由于 HTML
文档是由浏览器从上到下依次载入的，将 JavaScript 代码放置于<head></head>
标签之间，可以确保在需要使用脚本之前，它已经被载入了。
二、HTML 页面的 <body>
部分中
　　设想如下一种情况：我们有一段 JavaScript 代码需要操作 HTML 元素。但由于 HTML
文档是由浏览器从上到下依次载入的，为避免 JavaScript 代码操作 HTML 元素时，HTML 元素还未载入而报错（对象不存在），因此需要将这段代码写到
HTML 元素后面。
　　注意：
　　HTML 中的脚本必须位于 <script> 与
</script> 标签之间。
三、脚本保存到外部文件中
　　在使用了外部引用 JavaScript 代码之后，其好处显而易见：
　　　　公共的
JavaScript 代码可以被复用于其他 HTML 文档，也利于 JavaScript 代码的统一维护
　　　　HTML
文档更小，利于搜索引擎收录
　　　　可以压缩、加密单个 JavaScript 文件
　　　　浏览器可以缓存 JavaScript
文件，减少宽带使用（当多个页面同时使用一个 JavaScript
文件的时候，通常只需下载一次）
　　注意：
　　如需使用外部文件，在 <script> 标签的 "src"
属性中设置该 .js 文件：
　　<script src="myScript.js"></script>
　　外部脚本不能包含
<script> 标签。
　　将 JavaScript 代码形成为外部文件，也会增加服务器的 HTTP
请求负担，在超高并发请求的环境下，这并不是一个好的策略。另外 在引用外部 js 文件时，需注意文件的正确路径。

JS-JS代码插入位置的更多相关文章

  1. 基于面向对象的图片轮播（js原生代码）

    无论你想走多远,你都需要不断地走下去.前端最精华的便是原生的js,这也是我们前端工程师的技术分层的重要指标,也提现这你的代码能力,开发的水平.废话不多说,进入今天的主要分享————基于面向对象思想的图 ...

  2. 网络问卷调查js实现代码

    昨天一个同行妹纸写了一个网络问卷调查的效果,但是有bug,于是就来问我该如何解决这个bug.经过我的分析,bug主要还是出在复选框的那部分,经过修改,bug问题解决,现在贴出如下代码,仅供大家参考: ...

  3. js原生代码实现轮播图案例

    一.轮播图是现在网站网页上最常见的效果之一,对于轮播图的功能,要求不同,效果也不同! 我们见过很多通过不同的方式,实现这一效果,但是有很多比较麻烦,而且不容易理解,兼容性也不好. 在这里分享一下,用j ...

  4. 在Sublime Text 3 中安装SublimeLinter,Node.js进行JS&CSS代码校验

    转载自:http://www.wiibil.com/website/sublimelinter-jshint-csslint.html 在Sublime Text中安装SublimeLinter,No ...

  5. 仿jQuery的siblings效果的js原生代码

    仿jQuery的siblings效果的js原生代码 <previousSibling> 属性返回选定节点的上一个同级节点(在相同树层级中的前一个节点). <nextSibling&g ...

  6. SpringMVC学习系列-后记 结合SpringMVC和Hibernate-validator，根据后台验证规则自动生成前台的js验证代码

    在SpringMVC学习系列(6) 之 数据验证中我们已经学习了如何结合Hibernate-validator进行后台的数据合法性验证,但是通常来说后台验证只是第二道保险,为了更好的用户体验会现在前端 ...

  7. 响应式js幻灯片代码一枚

    网站搭建经常会用到js幻灯片轮播,放上几张上档次的美图,为你的爱站增添大气元素.经常看到一些js幻灯片代码,但是感觉不是很美观,有的也不支持自适应缩放,也即是响应式,现在智能手机的普及以及移动浏览器技 ...

  8. ASP.Net MVC4中封装CSS和js冗余代码（不让其大篇的显示在前台上）

    (1)封装CSS和JS代码,使用调用的方式在前台进行调用.是开发看起来简洁和易于管理,可达到重用.   由于asp.netMVC4 框架 ,在封装js和CSS的时候,有如下规范: using Syst ...

  9. 使用正则表达式匹配JS函数代码

    使用正则表达式匹配JS函数代码 String someFunction="init"; Pattern regex = Pattern.compile("function ...

  10. JS倒计时 代码

    JS倒计时 代码 <div> <span id="KSD">3</span>天 <span id="KSH">1 ...

随机推荐

  1. Java数据解析---PULL

    安卓和JAVA解析xml文件的三种方式: 1.PULL解析 2.SAX解析 3.DOM解析 三者各有所长,依情况选择解析方式 1.PULL和SAX均采用流式解析,意味着只能从头读到底,无法像DOM解析 ...

  2. maven(七)，本地仓库

    运行机制: 在pom.xml文件中添加依赖jar包时,首先会从本地仓库查找,如果本地仓库不存在,就从中央仓库下载到本地仓库,中央仓库是maven默认的远程仓库 仓库坐标 eclipse默认会在wind ...

  3. Android 电池系列

    android 电池(一):锂电池基本原理篇 android 电池(二):android关机充电流程.充电画面显示 android 电池(三):android电池系统 android电池(四):电池 ...

  4. STL vector简单用法

    初涉c++,此为<算法笔记>中的内容,有待个人理解完善. vector vector翻译为向量,叫做"变长数组"更容易理解. 头文件:#include<vecto ...

  5. <项目需求规格说明书> - 福大易宝

    福大易宝-<项目需求规格说明书> 流程 在开会时统一了项目的开发背景,具体功能,然后在同一个工作环境下进行该说明书的编写. 分工 1.李佳铭.杜宏庆共同负责引言和项目描述的内容. 2.刘双 ...

  6. Beta阶段总结博客（麻瓜制造者）

    Beta冲刺过程中各个成员的贡献百分比: 成员 贡献值 邓弘立 15% 符天愉 14% 江郑 14% 刘双玉 14% 肖小强 13% 李佳铭 11% 汪志彬 11% 伍杰麟 8% 项目的发布说明 本版 ...

  7. Properties集合_练习

    定义功能:获取一个应用程序 运行次数,如果超过5次,给出使用次数已到请注册的提示,并不要再运行程序 思路:  1.定义计数器:每次程序启动都需要计数一次,并且是在原有的次数上进行计数.  2.计数器就 ...

  8. Spring集成MyBatis持久层框架

    一.MyBatis介绍 MyBatis 是一款优秀的持久层框架,它支持定制化SQL.存储过程以及高级映射.MyBatis 避免了几乎所有的JDBC代码和手动设置参数以及获取结果集,可以使用简单的XML ...

  9. console.time和console.timeEnd用法

    console.time和console.timeEnd这两个方法可以用来让WEB开发人员测量一个javascript脚本程序执行消耗的时间.随着WEB应用越来越重要,JavaScript的执行性能也 ...

  10. Excel里面Left这个怎么用？

    LEFT 返回文本字符串中第一个字符或前几个字符LEFT(A2, 4)LEFT 返回前 4 个字符,因为每个字符按 1 计数.无论您计算机上的默认语言设置如何,函数 LEFT 都返回前 4 个字符.