`

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. **异步加载...

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

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

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

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

    jquery页面加载效果

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

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

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

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

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

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

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

    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来实现页面加载等待效果。这种效果通常被称为“加载指示器”或“进度条”,它可以让用户知道页面正在加载,...

    android中webview加载本地页面,并处理js事件

    通过`setWebViewClient()`设置`WebViewClient`,可以监听页面加载状态,如加载开始、加载完成等。 - 使用`loadUrl()`方法加载本地或远程URL。加载本地HTML时,通常将HTML文件放在`assets`或`res/raw`目录下,通过`...

Global site tag (gtag.js) - Google Analytics