`
younglibin
  • 浏览: 1214234 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js在jsp中的加载执行顺序

    博客分类:
  • js
阅读更多
页面上的Javascript代码是HTML文档的一部分,所以Javascript在页面装载时执行的顺序就是其引入标记<script />的出现顺序, <script />标记里面的或者通过src引入的外部JS,都是按照其语句出现的顺序执行,而且执行过程是文档装载的一部分。
每个脚本定义的全局变量和函数,都可以被后面执行的脚本所调用。
变量的调用,必须是前面已经声明,否则获取的变量值是undefined。
<script type="text/javscrpt">//<![CDATA[
alert(tmp);  //输出 undefined
var tmp = 1;
alert(tmp);  //输出 1
//]]></script>同一段脚本,函数定义可以出现在函数调用的后面,但是如果是分别在两段代码,且函数调用在第一段代码中,则会报函数未定义错误。
<script type="text/javscrpt">//<![CDATA[
aa();            //浏览器报错
//]]></script>
<script type="text/javscrpt">//<![CDATA[
aa(); //输出 1
function aa(){alert(1);}
//]]></script>document.write()会把输出写入到脚本文档所在的位置,浏览器解析完documemt.write()所在文档内容后,继续解析document.write()输出的内容,然后在继续解析HTML文档。
<script type="text/javascript">//<![CDATA[
    document.write('<script type="text/javascript" src="test.js"><\/script>');
    document.write('<script type="text/javascript">');
    document.write('alert(2);')
    document.write('alert("我是" + tmpStr);');
    document.write('<\/script>');
    //]]></script>
  <script type="text/javascript">//<![CDATA[
    alert(3);
    //]]></script>test.js的内容是:

var tmpStr = 1;
    alert(tmpStr);在Firefox和Opera中的弹出值的顺序是:1、2、我是1、3
在IE中弹出值的顺序是:2、1、3,同时浏览器报错:tmpStr未定义
原因可能是IE在document.write时,并未等待加载SRC中的Javascript代码完毕后,才执行下一行,所以导致2先弹出,并且执行到document.write(’document.write("我是" + tmpStr)’)调用tmpStr时,tmpStr并未定义,从而报错。

解决这个问题,可以利用HTML解析是解析完一个HTML标签,再执行下一个的原理,把代码拆分来实现:

<script type="text/javascript">//<![CDATA[
    document.write('<script type="text/javascript" src="test.js"><\/script>');
    //]]></script>
  <script type="text/javascript">//<![CDATA[
    document.write('<script type="text/javascript">');
    document.write('alert(2);')
    document.write('alert("我是" + tmpStr);');
    document.write('<\/script>');
    //]]></script>
  <script type="text/javascript">//<![CDATA[
    alert(3);
    //]]></script>这样IE下和其他浏览器输出值的顺序都是一直的了:1、2、我是1、3。


本文来自CSDN博客,转载请标明出处:http://blog.csdn.net/cnkiminzhuhu/archive/2008/01/28/2069560.aspx
分享到:
评论

相关推荐

    jsp页面加载时提示loading

    9. **JavaScript阻塞渲染**:如果JSP页面中存在阻塞渲染的JavaScript代码,浏览器会在执行完这些代码后才继续渲染页面。将脚本放在`&lt;body&gt;`标签底部,或使用`async`或`defer`属性可以避免这种问题。 10. **JSP预...

    jsp页面加载之遮罩层

    "jsp页面加载之遮罩层"这个主题关注的是在JSP页面加载过程中,如何使用遮罩层来提升用户体验,尤其是在等待页面完全加载时提供一种视觉反馈,让用户知道页面正在处理。 首先,遮罩层通常是一个半透明的div元素,...

    jsp页面中的代码执行加载顺序介绍.docx

    ### JSP页面中的代码执行加载顺序详解 #### 一、引言 JSP(Java Server Pages)是一种基于Java技术的动态网页技术标准,它通过将动态生成的内容嵌入到静态HTML页面中,使得Web应用程序能够生成动态变化的内容。在...

    jsp页面中的代码执行加载顺序介绍

    了解JSP页面中的代码执行加载顺序对于Web开发人员来说至关重要,因为它影响页面的表现和功能的实现。 JSP页面中的代码主要分为三部分:Java代码、JSP标签和脚本以及客户端的JavaScript和HTML代码。这些部分的执行...

    多种方法实现当jsp页面完全加载完成后执行一个js函数

    在网页开发中,有时我们需要确保页面完全加载后再执行某些JavaScript函数,这有助于保证操作的正确性和用户体验。在JSP页面中,实现这个需求有多种方式。以下将详细讲解标题和描述中提到的几种常见方法: 1. **使用...

    四款由html+css+js实现的精美网页加载页面动画源码

    在这些加载动画中,JS通常用来监听页面加载事件,如DOMContentLoaded或load事件,当页面内容加载完成后,JS会停止加载动画,显示实际内容。此外,JS还可以根据用户行为触发动画,比如点击按钮启动加载动画。例如,...

    jSon调用jsp页面,jsp页面中加载公司标签的实现过程(json 异步)

    本话题聚焦于如何利用json(JavaScript Object Notation)进行异步调用,以及在jsp(JavaServer Pages)页面中加载公司标签的实现过程。以下是对这个主题的详细讲解: 首先,json是一种轻量级的数据交换格式,它...

    jsloader 异步加载js文件

    在网页开发中,JavaScript文件的加载是网页渲染过程中的关键步骤。大型应用往往包含多个JS文件,这可能导致页面加载速度变慢,影响用户体验。为了解决这个问题,开发者引入了异步加载(Asynchronous Loading)技术,...

    页面加载时 提示 正在加载中

    在网页设计和开发中,用户体验是...总的来说,`loading.jsp`是利用JSP、HTML、CSS和JavaScript技术实现的一种页面加载提示机制,它提升了用户在等待页面加载过程中的体验,同时也展现了Web开发中对用户体验的细致考虑。

    JS和JSP制作的动态菜单

    JavaScript(简称JS)和JavaServer Pages(简称JSP)是两种在Web开发中常见的技术,它们经常被用来创建交互式的动态网页。在这个场景中,"JS和JSP制作的动态菜单"指的是使用JavaScript来实现前端的动态效果,而JSP则...

    用Eclipse与AJAX技术在JSP中实现动态加载列表框

    本文详细介绍了如何使用Eclipse IDE结合AJAX技术在JSP中实现动态加载列表框的过程。通过这种方式,可以显著提升Web应用的用户体验和性能。开发者需要熟悉AJAX的基本原理以及如何在不同浏览器环境下正确创建...

    JSP中调用js日期控件

    在JSP(JavaServer Pages)开发中,为了增强用户体验,我们常常会使用JavaScript日期控件来帮助用户方便地选择日期。这些控件不仅简化了日期输入的过程,而且提供了丰富的自定义选项,使得网页的交互性更强。本篇将...

    jsp文件运行的机制

    这个过程会在首次访问时发生,之后再次访问同一页面时,除非修改了JSP文件或手动清理了编译后的文件,否则将直接使用已有的.class文件进行执行,因此速度会更快。 #### 四、示例分析 考虑下面的JSP文件`hello.jsp`...

    jsp进度条js方案

    在JSP(JavaServer Pages)页面中,我们通常会结合JavaScript(JS)来实现动态的进度条效果。本篇文章将深入探讨如何在JSP页面中运用JS实现进度条方案。 首先,我们要了解进度条的基本结构。进度条通常由HTML元素如...

    用jsp实现的进度条

    在Web应用程序中,进度条通常用于告知用户某个长时间运行的任务(如文件上传、数据处理或大文件下载)的当前状态,提升用户体验。 在JSP中实现进度条,我们可以利用AJAX(Asynchronous JavaScript and XML)进行...

    jsp运行原理

    在JSP页面中,JavaScript代码通常放置在`&lt;script&gt;`标签中,这些代码不会被服务器端执行,而是直接传递给客户端浏览器执行。相反,JSP代码则会在服务器端执行,并将执行结果返回给客户端。 #### 五、JSP与Servlet的...

    1024小游戏_jsp_js

    【标题】"1024小游戏_jsp_js"是一个基于JSP(JavaServer Pages)和JavaScript技术开发的小型游戏项目,旨在帮助初学者理解和实践这两种技术的结合应用。在这个项目中,用户可以在网页上玩一个经典的数字合成游戏,即...

    在线选课系统 java servlet+ jsp+mysql+css+js制作

    在在线选课系统中,Servlet扮演着服务器端程序的角色,处理HTTP请求,执行业务逻辑,如处理学生的选课请求,老师的课程添加等,并将结果返回给客户端。Servlet通过`doGet`和`doPost`等方法响应HTTP请求,与JSP协同...

    JSP,JavaScript,Servlet等做的简单的Blog程序

    在Blog程序中,JavaScript通常负责用户界面的交互,如表单验证、动态加载评论、时间戳格式化等功能。它可以通过AJAX(Asynchronous JavaScript and XML)与服务器进行异步通信,无需刷新整个页面即可更新数据。 **...

    ko.rar_ajax_ajax jsp_javascript_jsp

    本实例“ko.rar_ajax_ajax jsp_javascript_jsp”显然是关于如何在JSP(JavaServer Pages)环境中运用Ajax技术的教程,旨在帮助学习者更好地理解和实践Ajax与JSP的结合。 首先,让我们详细了解一下Ajax的基础。Ajax...

Global site tag (gtag.js) - Google Analytics