嵌入javascript脚本的位置
JavaScript脚本可以放在HTML文档任何需要的位置。一般来说,可以在<head>与</head>、<body>与</body>标记对之间按需要放置JavaScript脚本代码。
一、放在<head>与</head>标记对之间
放置在<head>与</head>标记对之间的JavaScript脚本代码一般用于提前载入以响应用户的动作,一般不影响HTML文档的浏览器显示内容。如下是其基本文档结构:
1 <html>
2 <head>
3 <title>放置在<head>与</head>标记对之间</title>
4 <!--直接写JavaScript代码-->
5 <script type="text/javascript">
6 //JavaScript代码
7 </script>
8 <!--引入外部脚本-->
9 <script type="text/javascript" src="1.js"></script>
10 </head>
11 <body>
12 </body>
13 </html>
二、放置在<body>与</body>标记对之间
JavaScript脚本也可以放置在<body>与</body>标记对之间,可根据需要写多个独立的脚本代码段并与HTML代码结合在一起。
1 <html>
2 <head>
3 <title>放置在<body>与</body>标记对之间</title>
4 </head>
5 <body>
6 <!--直接写JavaScript代码-->
7 <script type="text/javascript">
8 //JavaScript代码
9 </script>
10 <!--引入外部脚本-->
11 <script type="text/javascript" src="1.js"></script>
12 </body>
13 </html>
注意:在<head>和<body>标签内可以有多个代码块,只要放在<script type="text/javascript">与</script>之间或者引入外部脚本即可。同时,JavaScript脚本也可以放在其他任意HTML标签之间,如<div>、<p>、<span>等。
说明:浏览器一般是从上到下渲染HTML,当遇到JavaScript代码时,浏览器将发生阻塞(不再解析后面的任何代码,包括HTML和JavaScript),有些浏览器在阻塞期间不会解析该JavaScript后面的HTML代码,必须等到该JavaScript代码执行完毕,才继续解析。如果将JavaScript放置在<head>...</head>或者<body>...</body>之间,经常会发生会发生这种现象:浏览器先是呈现一部分页面,再呈现后边的页面,中间间隔时间明显。这样带来的明显结果就是用户体验差。
因此,如无特殊要求,我们强烈建议将JavaScript代码置于<body>...</body>的最后。如:
<body>
<!--HTML代码-->
<script type="text/javascript">
</scirpt>
<script type="text/javascript" src="1.js"></scirpt>
</body>
原文链接:http://www.itxueyuan.org/view/6297.html
嵌入javascript脚本的位置的更多相关文章
- smarty模板中如何嵌入javascript脚本
[官方网站](http://www.php100.com/manual/smarty/) 在smarty文件里直接写javascript代码时候,造成500错误. javascript代码有很多的{} ...
- JavaScript脚本在页面中放置的位置
JavaScript脚本通常放置在三个位置: 1.head部分JavaScript脚本. 2.body部分JavaScript脚本. 3.单独以.js结尾的文件中的JavaScript脚本. 客户端会 ...
- JavaScript脚本语言基础(一)
导读: JavaScript代码嵌入HTML文档 JavaScript代码运行方式 第一个实例 JavaScript的三种对话框 定义JavaScript变量 JavaScript运算符和操作符 Ja ...
- JavaScript脚本语言基础(四)
导读: JavaScript和DOM DOM文档对象常用方法和属性 DOW文档对象运用 JSON数据交换格式 正则表达式 1.JavaScript和DOM [返回] 文档对象模型(Document O ...
- JavaScript脚本语言基础(三)
导读: 数学对象(Math) 数组对象(Array) 字符串对象(String) 日期对象(Date) js对象是属性和方法的集合.JavaScript中的所有事物都是对象,如:字符串.数值.数组.函 ...
- Windows桌面或服务器环境下嵌入JavaScript支持(JSRT)
很多人比较关注Google的JS V8 JavaScript引擎,确实Google最近很高调.但这个库在Windows下使用确实有点难度,即使在Linux嵌入,也需要下载gyp,编译安装,然后再下载v ...
- 浏览器环境下JavaScript脚本加载与执行探析之代码执行顺序
本文主要基于向HTML页面引入JavaScript的几种方式,分析HTML中JavaScript脚本的执行顺序问题 1. 关于JavaScript脚本执行的阻塞性 JavaScript在浏览器中被解析 ...
- 可嵌入的脚本引擎 Jx9
Jx9是一个可嵌入的脚本引擎,基于JSON实现了图灵完备(Turing complete)的编程语言. Jx9 是那些需要流行和高效率脚本支持应用程序(比如:游戏.数据库系统,文本编辑器,网络应用程序 ...
- javascript脚本何时会被执行
javascript脚本可以嵌入在html内的任意地方,但它何时被调用呢?当浏览器打开HTML文件后,会直接运行不是声明函数的脚本或通过事件调用脚本函数,下面分析这几种情况. 1.浏览器在打开页面时执 ...
随机推荐
- STM32F4时钟配置分析
//学习STM32F4的过程中关于时钟上面讲的比较好 特地转发与大家分享 STM32F4时钟设置分析 原文博客链接:http://blog.csdn.net/jdh99,作者:jdh,转载请注明. 环 ...
- 使用git恢复未提交的误删数据
不小心将项目中一个文件夹删除还未提交,或者已经提交, 此时想要恢复数据该怎么办? 答案是git reflog,使用git reflog命令可以帮助恢复git误操作,进行数据恢复. 操作过程: 打开终端 ...
- 每天一个linux命令(27)--tar命令
通过SSH访问服务器,难免会要用到压缩,解压缩,打包,解包等,这时候 tar 命令就是必不可少的一个功能强大的工具.Linux 中最流行的 tar 是麻雀虽小,五脏俱全. tar 命令可以为Linux ...
- dubbo源码分析(一)
*:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: 0 !important; } /* ...
- MySQL学习分享-->日期时间类型
日期时间类型 ①如果要用来表示年月日时分秒,一般使用datetime类型: ②如果要用来表示年月日,一般使用date类型: ③如果要表示时分秒,一般使用time类型: ④如果只是表示年份,一般使用ye ...
- C/C++学习路线图
文章转载自「开发者圆桌」一个关于开发者入门.进阶.踩坑的微信公众号 这里整理的C/C++学习路线图包含初中高三个部分,你可以通过百度云盘下载观看对应的视频 链接: http://pan.baidu.c ...
- cocos studio UI 1.6.0.0 修改导出项目路径
因为cocos studio UI 1.6.0.0版本没有自动修改默认导出路径的功能,新建项目后默认导出的路径还是上一个项目的,每次导出都要重新设置路径很麻烦.于是考虑是否可以找到默认配置文件,终于还 ...
- 算法模板——splay区间反转 1
实现的功能:将序列区间反转,并维护 详见BZOJ3223 var i,j,k,l,m,n,head,a1,a2:longint; s1:ansistring; a,b,c,d,fat,lef,rig: ...
- 1635: [Usaco2007 Jan]Tallest Cow 最高的牛
1635: [Usaco2007 Jan]Tallest Cow 最高的牛 Time Limit: 5 Sec Memory Limit: 64 MBSubmit: 383 Solved: 211 ...
- java Pattern和Matcher详解
结论:Pattern与Matcher一起合作.Matcher类提供了对正则表达式的分组支持,以及对正则表达式的多次匹配支持. 单独用Pattern只能使用Pattern.matcher(String ...