`

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作为前端开发的核心技术之一...通过本文的介绍和代码示例,读者应该能够对如何在JavaScript中处理页面加载完毕后的事件有了一个全面的认识,并能在此基础上应用到实际的项目开发中。

    Javascript在页面加载时的执行顺序.pdf

    JavaScript在页面加载时的执行顺序是网页开发中的关键概念,对于理解JavaScript如何与HTML交互至关重要。以下是关于这一主题的详细解释: 首先,我们来看在HTML中嵌入JavaScript的几种常见方式: 1. **内联脚本**...

    javascript经典特效---在网页中运行代码.rar

    本压缩包“javascript经典特效---在网页中运行代码.rar”聚焦于如何在网页中利用JavaScript来实现各种特效,使网页更加生动有趣。 在网页中运行JavaScript代码,首先需要理解HTML、CSS和JavaScript三者的协同工作...

    jsp页面加载时提示loading

    在IT行业中,JSP(JavaServer Pages)是一种用于创建动态网页的技术,它是Java技术的一部分,允许开发者将HTML、CSS和JavaScript代码与Java代码相结合,从而实现服务器端的业务逻辑处理。当你遇到“jsp页面加载时...

    jsp页面加载方法

    defer属性可以使得脚本在整个页面加载完后运行。 代码实现 ```html &lt;script defer="defer" language="javascript"&gt; ``` jsp页面加载方法可以根据不同的需求选择合适的方法。方法1是最常用的方法,方法2和方法3...

    javascript控件开发之动态加载

    动态加载意味着控件或资源不是在页面加载时一次性全部加载,而是根据需要按需加载,从而减少了初始页面加载时间,降低了对用户网络带宽的需求。 动态加载主要涉及到以下几个核心知识点: 1. **异步加载...

    加载页面等待提示程序加载页面等待提示程序

    从文件名称“loadingtag.tld”来看,可能是与加载提示相关的标签定义文件,可能是用于控制页面加载行为的配置。而“com”可能是与组件或域名相关,可能涉及服务器端的处理。具体的实现细节则需要查看这些文件的具体...

    100个Javascript特效页面以及源代码

    5. **AJAX异步请求**:AJAX允许页面在不刷新的情况下与服务器交换数据并更新部分页面内容,常见应用如无限滚动加载、表单提交等。 6. **面向对象编程**:JavaScript支持面向对象编程,通过构造函数和原型链可以创建...

    实现在HTML页面加载完毕后运行js方法.docx

    在 HTML 页面中,经常需要在页面加载完毕后执行某些 JavaScript 代码,以确保页面中的所有元素都已经加载完毕,可以被 JavaScript 代码所操作。有两种常见的方法可以实现这点,一种是使用 `window.onload` 事件,另...

    简单jQuery加载等待转圈页面插件

    在网页开发中,用户体验至关重要,尤其是在处理数据加载或者页面跳转时,用户往往需要等待,此时加载等待界面就显得尤为重要。"简单jQuery加载等待转圈页面插件"就是为了解决这个问题而设计的,它能提供一个优雅的、...

    jquery页面加载效果

    在网页设计中,用户体验是至关重要的,而页面加载效果正是提升用户体验的一种手段。"jQuery页面加载效果"是指利用JavaScript库jQuery实现的动态加载动画,它能够以吸引人的视觉方式展示网页内容正在加载的过程,使...

    酷炫 html5页面加载 loading动画效果 demo 基于原生无第三方依赖

    HTML5页面加载动画是网页设计中的一个重要元素,它在页面内容完全加载之前为用户提供视觉反馈,使得用户体验更加流畅。本示例"酷炫html5页面加载loading动画效果demo"是基于原生JavaScript和CSS实现的,无需任何第三...

    jquery页面跳转loading加载

    在实际开发中,开发者可能会利用现有的jQuery插件,如jQuery BlockUI,来快速实现页面加载的loading效果,或者自定义JavaScript和CSS代码以满足特定的需求。 总的来说,"jquery页面跳转loading加载"是一个关于提升...

    JavaScript仿淘宝页面图片滚动加载及刷新回顶部的方法解析_.docx

    JavaScript仿淘宝页面图片滚动加载及刷新回顶部的方法解析 在网页设计中,为了提升用户...同时,对于大型网站而言,这样的优化对于提高页面加载速度和降低服务器压力至关重要,也是保障网站安全稳定运行的重要措施。

    angularJS的页面加载切换效果

    在本文中,我们将深入探讨如何使用AngularJS实现页面加载与切换时的动画效果。AngularJS是一个流行的前端JavaScript框架,它提供了强大的数据绑定和模块化功能,使得开发动态Web应用变得简单。当我们谈论“页面加载...

    scriptjs异步JavaScript加载器和依赖管理器

    在Web开发中,JavaScript的异步加载和依赖管理是优化页面性能的关键因素。`script.js`是一个轻量级且功能强大的工具,它允许开发者实现异步加载JavaScript文件,并有效地管理它们之间的依赖关系,从而提升网页的加载...

    聂微东-页面滚动图片加载

    这尤其适用于内容丰富的网站,如QQ空间,它可能包含大量的图片和媒体元素,如果一次性全部加载,会消耗大量网络资源,导致页面加载速度变慢,对用户的浏览体验造成负面影响。 "前台js"这个标签表明这种技术是通过...

    Javascript打开页面等待效果

    在网页加载过程中,用户可能会遇到长时间等待的情况,此时为了提供更好的用户体验,我们可以使用JavaScript来实现页面加载等待效果。这种效果通常被称为“加载指示器”或“进度条”,它可以让用户知道页面正在加载,...

    Javascript ajax加载Loading

    JavaScript AJAX(异步JavaScript和XML)技术是一种在不刷新整个页面的情况下与服务器交换数据并更新部分网页的方法。在处理大量数据或执行耗时操作时,为了提供更好的用户体验,通常会使用“加载中”(Loading)...

Global site tag (gtag.js) - Google Analytics