`

JavaScript在页面中的位置,加载与运行

阅读更多
把 JavaScript 放置到何处?

当页面载入时,会执行位于 body 部分的 JavaScript。

当被调用时,位于 head 部分的 JavaScript 才会被执行。

1. head 部分
   包含函数的脚本位于文档的 head 部分。这样我们就可以确保在调用函数前,脚本已经载入了。当脚本被调用时,或者当事件被触发时,脚本就会被执行。当你把脚本放置到 head 部分后,就可以确保在需要使用脚本之前,它已经被载入了。
代码:
<html>
<head>
<script type="text/javascript">
....
</script>
</head>
....

2.位于 body 部分的脚本:
在页面载入时脚本就会被执行。当你把脚本放置于 body 部分后,它就会生成页面的内容。
<html>
<head>
</head>

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

注:在 body 和 head 部分的脚本:

你可以在文档中放置任何数量的脚本,因此你既可以把脚本放置到 body,又可以放置到 head 部分。

<html>
<head>
<script type="text/javascript">
....
</script>
</head>

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

3. 使用外部 JavaScript

有时,你也许希望在若干个页面中运行 JavaScript,同时不在每个页面中写相同的脚本。

为了达到这个目的,你可以将 JavaScript 写入一个外部文件之中。然后以 .js 为后缀保存这个文件。

注意:外部文件不能包含 <script> 标签。

然后把 .js 文件指定给 <script> 标签中的 "src" 属性,就可以使用这个外部文件了:

<html>
<head>
<script src="xxx.js">
....
</script>
</head>
<body>
</body>
</html>

提示:您可以把 .js 文件放到网站目录中通常存放脚本的子目录中,这样更容易管理和维护。



0
0
分享到:
评论

相关推荐

    高性能JavaScript编程(中英文)

    《高性能JavaScript》揭示的技术和策略能帮助你在开发过程中消除性能瓶颈。你将会了解如何提升各方面的性能,包括代码的加载、运行、DOM交互、页面生存周期等。雅虎的前端工程师Nicholas C. Zakas和其他五位...

    高性能JavaScript 编程pdf电子书(中英文对译)

    《高性能JavaScript》揭示的技术和策略能帮助你在开发过程中消除性能瓶颈。你将会了解如何提升各方面的性能,包括代码的加载、运行、DOM交互、页面生存周期等。雅虎的前端工程师Nicholas C. Zakas和其他五位...

    解决ajax返回innerHTML中javascript不能运行问题

    这样就相当于在打开模板页面的同时加载了所有 `&lt;div&gt;` 标签需要的 JavaScript。奇怪的是这些脚本必须添加在 `&lt;head&gt;` 标签中 FF 才能有效,如果有人知道原因希望可以指点一下。 在实现中,我们可以使用 JavaScript ...

    对母版页使用css与javascript

    对母版页使用CSS与JavaScript 在Web开发中,使用母版页(Master Page)可以方便地实现页面统一布局和样式管理。...同时,在实际开发中,我们需要根据实际情况选择最合适的解决方案,以确保页面的加载速度和可维护性。

    《高性能JavaScript》

    《高性能JavaScript》揭示的技术和策略能帮助你在开发过程中消除性能瓶颈。你将会了解如何提升各方面的性能,包括代码的加载、运行、DOM交互、页面生存周期等。雅虎的前端工程师Nicholas C. Zakas和其他五位...

    高性能JavaScript

    你将会了解如何提升各方面的性能,包括代码的加载、运行、DOM交互、页面生存周期等。雅虎的前端工程师Nicholas C. Zakas和其他五位JavaScript专家介绍了页面代码加载的最佳方法和编程技巧,来帮助你编写更为高效和...

    高性能JavaScript 高清完整.pdf版下载

    《高性能JavaScript》揭示的技术和策略能帮助你在开发过程中消除性能瓶颈。你将会了解如何提升各方面的性能,包括代码的加载、运行、DOM交互、页面生存周期等。雅虎的前端工程师Nicholas C. Zakas和其他五位...

    JavaScript完全自学宝典 源代码

    2.1.html JavaScript中this在不同位置指向的对象。 2.2.html null类型的简单应用。 2.3.html 算术运算符用法。 2.4.html 逻辑运算符使用方法。 2.5.html 位运算符使用方法。 2.6.html 赋值...

    高性能JavaScript(High Performance JavaScript )

    《高性能JavaScript》揭示的技术和策略能帮助你在开发过程中消除性能瓶颈。你将会了解如何提升各方面的性能,包括代码的加载、运行、DOM 交互、页面生存周期等。雅虎的前端工程师 Nicholas C. Zakas 和其他五位 ...

    javascript练手项目

    客户端脚本:JavaScript主要运行在浏览器中,允许开发者在用户浏览网页时动态修改页面内容,增强用户体验。 跨平台:JavaScript可以在所有主要的浏览器和操作系统上运行,无需任何修改。 面向对象:JavaScript支持...

    高性能JavaScript编程

    《高性能JavaScript》揭示的技术和策略能帮助你在开发过程中消除性能瓶颈。你将会了解如何提升各方面的性能,包括代码的加载、运行、DOM交互、页面生存周期等。雅虎的前端工程师Nicholas C. Zakas和其他五位...

    scrapy结合selenium解析动态页面的实现

    虽然scrapy能够完美且快速的抓取静态页面,但是在现实中,目前绝大多数网站的页面都是动态页面,动态页面中的部分内容是浏览器运行页面中的JavaScript脚本动态生成的,爬取相对困难; 比如你信心满满的写好了一个...

    《程序天下:JavaScript实例自学手册》光盘源码

    14.15 在JavaScript运行VBScript函数 14.16 购物篮中常用的计算总价效果 14.17 同一用户的来访统计 14.18 十六进制转换为十进制 14.19 将URL转化为16进制 14.20 小写金额转换为大写 14.21 通过两点坐标计算直线距离 ...

    JavaScript优化专题之Loading and Execution加载和运行

    JavaScript 在浏览器中的性能,可认为是开发者所要面对的最重要的可用性问题。此问题因JavaScript的阻塞特征而复杂...不论实际的JavaScript 代码是内联的还是包含在一个不相干的外部文件中,页面下载和解析过程必须停下

    5种JavaScript脚本加载的方式

    javaScript文件(下面简称脚本文件)需要被HTML文件引用才能在浏览器中运行。在HTML文件中可以通过不同的方式来引用脚本文件,我们需要关注的是,这些方式的具体实现和这些方式可能会带来的性能问题。 当浏览器遇到...

    高性能JavaScript_中英双语版.rar

    《高性能JavaScript》揭示的技术和策略能帮助你在开发过程中消除性能瓶颈。你将会了解如何提升各方面的性能,包括代码的加载、运行、DOM交互、页面生存周期等。雅虎的前端工程师Nicholas C. Zakas和其他五位...

Global site tag (gtag.js) - Google Analytics