一、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. 第一个Django页面(2)

    第一个Django页面 1,进入forum项目:熟悉项目里各种文件的作用 2,配置URL:在urls.py里面添加 [url路径与对应的处理函数] 3,编写处理函数:根据urls.py里添加函数的路径 ...

  2. sqlserver 2017 docker安装(启动代理)

    从 Docker Hub 中拉出 SQL Server 2017 Linux 容器映像. docker pull microsoft/mssql-server-linux:2017-latest 运行 ...

  3. 洗礼灵魂,修炼python(9)--灵性的字符串

    python几大核心之——字符串 1.什么是字符串 其实前面说到数据类型时说过了,就是带有引号的参数,“”引号内的一切东西就是字符串,字符串又叫文本. 2.创建字符串的两种方式: 3.字符串的方法: ...

  4. 【HANA系列】SAP HANA XS使用JavaScript数据交互详解

    公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[HANA系列]SAP HANA XS使用Jav ...

  5. centos6.5下oracle11g开机自动启动方法一

    转裁于 方法一 https://blog.csdn.net/wx5040257/article/details/77875690 方法二  https://blog.csdn.net/wx504025 ...

  6. python UDP套接字通信

    UDPserver.py import socket #导入套接字模块 s = socket.socket(socket.AF_INET,socket.SOCK_DGRAM) # - socket.A ...

  7. 第五章 绘图基础(LINEDEMO)

    LINEDEMO程序绘制一个矩形.两条直线.一个椭圆和一个圆角矩形.该程序表明,定义了封闭矩形的这些函数确实对这些区域进行了填充,因为椭圆后面的线被隐藏了. /*------------------- ...

  8. php解决前后端验证字符串长度不一致

    前端代码 function getStrleng(str){ var myLen =0; for(var i=0;i<str.length;i++){ if(str.charCodeAt(i)& ...

  9. Head First Android --- Enable USB debugging on your device

    1. Enable USB debugging on your device    On your device, open “Developer options” (in Android 4.0 o ...

  10. kvm企业级虚拟化环境部署

    由于要做毕设了,不得不要搭建Linux环境,自己做的课题是ELK日志分析相关.因此要大干一场,一下子计划采用近10台机器来做试验,但由于我这里只有三台物理机,所以我就搞起了虚拟化kvm.在Linux里 ...