www.2527.com_澳门新葡8455手机版_新京葡娱乐场网址_
做最好的网站

onload事件不起功效示例解析,Javascript代码在页面

2019-08-02 03:15 来源:未知

前一段事件遭遇多个意料之外的标题,jsp页面中写三个onload事件,发掘居然不起功用,查看源文件,bady的onload后以致没有议程名???

一、在HTML中嵌入Javasript的方法
1.直接在Javascript代码放在标志对<script>和</script>之间
2.由<script />标识的src属性制定外界的js文件
3.位居事件管理程序中,比方:<p onclick="alert('小编是由onclick事件实施的Javascript')">点击本身</p>
4.用作U帕杰罗L的重头戏,那些URAV4L使用特别的Javascript:协议,举个例子:<a href="javascript:alert('我是由javascript:协议实践的javascript')">点击本身</a>
5.运用javascript自个儿的document.write()方法写入新的javascript代码
6.用到Ajax异步获取javascript代码,然后实践  

<body onload="这里依然是空的" bottommargin="0" leftmargin="0" topmargin="0" rightmargin="0">

第3种和第4种形式写入的Javascript须要接触手艺进行,所以唯有特别设置,不然页面加载时不会实行。

百思不得其解,

二、Javascript在页面包车型客车实行顺序
1.页面上的Javascript代码是HTML文书档案的一有的,所以Javascript在页面装载时进行的依次正是其引进标志<script />的面世顺序, <script />标记里面包车型客车恐怕通过src引进的表面JS,都是遵照其语句出现的相继实施,何况施行进程是文书档案装载的一有的。
2.种种脚本定义的全局变量和函数,都得以被后边实施的台本所调用。
3.变量的调用,必须是前方已经宣示,不然获取的变量值是undefined。

于是乎试验

复制代码 代码如下:

复制代码 代码如下:

<script type="text/javscrpt">//<![CDATA[
alert(tmp);  //输出 undefined
var tmp = 1;
alert(tmp);  //输出 1
//]]></script>

</body>
< script language="javascript">
window.onload = getState()
< /script>

4.同一段脚本,函数定义能够出现在函数调用的前面,不过倘就算独家在两段代码,且函数调用在率先段代码中,则会报函数未定义错误。

照旧是没难题的……,这是干什么吧??

复制代码 代码如下:

原来是<script src="<%=path%>/js/sorttable.js"></script>

<script type="text/javscrpt">//<![CDATA[
aa();            //浏览器报错
//]]></script>
<script type="text/javscrpt">//<![CDATA[
aa();   //输出 1
function aa(){alert(1);}
//]]></script>

引进那么些js里有该死的window.onload = sorttable.init;那么些js是任何页面中用到的,网络down的二个table操作js.

5.document.write()会把出口写入到剧本文档所在的岗位,浏览器解析完documemt.write()所在文书档案内容后,继续剖析document.write()输出的从头到尾的经过,然后在继续深入分析HTML文书档案。

足足给我们提醒一下,很恐怕是别的地点已经用过了,引起争持!

复制代码 代码如下:

你或者感兴趣的小说:

  • js的onload事件及开首化开关事件示例代码
  • js之onload事件的一点施用体验

<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。

三、怎样退换Javascript在页面的实践顺序
1.利用onload

复制代码 代码如下:

<script type="text/javascript">//<![CDATA[
window.onload = f;
function f(){alert(1);}
alert(2);
//]]></script>

输出值顺序是 2、1。

亟需专注的是,假诺存在多少个winodws.onload的话,唯有最有贰个立见功效,化解这些主意是:

复制代码 代码如下:

window.onload = function(){f();f1();f2();.....}

使用2级DOM事件类型

复制代码 代码如下:

if(document.addEventListener){
window.addEventListener('load',f,false);
window.addEventListener('load',f1,false);
...
}else{
window.attachEvent('onload',f);
window.attachEvent('onload',f1);
...
}

2.IE中能够动用defer,defer作用是把代码加载下来,并比不上时施行,等文书档案装载实现之后再实行,有一点类似window.onload,可是从未window.onload那样的局限性,能够重复使用,不过只在IE中有效,所以地点的例证能够修改成为

复制代码 代码如下:

<script type="text/javascript">//<![CDATA[
document.write('<script type="text/javascript" src="test.js"></script>');
document.write('<script type="text/javascript" defer="defer">');
document.write('alert(2);')
document.write('alert("我是" tmpStr);');
document.write('</script>');
//]]></script>
<script type="text/javascript">//<![CDATA[
alert(3);
//]]></script>

与上述同类IE就不报错了,输出值的次第产生:1、3、2、小编是1

当HTML分析器遭受一个剧本,它必须按正常终止对文书档案的深入分析并等待脚本执行。为了化解那些题目HTML4标准定义了defer。通过defer来提醒浏览器能够接二连三剖判HTML文书档案,并延迟施行脚本。这种延迟在剧本从表面文件载入时非常有用,让浏览器不必等待外界文件全体载入之后才继续推行,能管用的抓实品质。IE是当前独一扶助defer属性的浏览器,但IE并不曾准确的贯彻了defer属性,因为延迟的本子总是被推移,直到文书档案结束,并不是只延迟到下多个非延迟的剧本。那代表,IE中延迟的台本的实施各类卓越混乱,何况不可能定义任何后边非延迟脚本并须的函数和变量。在IE中保有的defer的本子实践时间应该都以HTML文档树建设构造以往,window.onload从前。

3.利用Ajax。
因为xmlhttpRequest能决断表面文档加载的场地,所以能够转移代码的加载顺序

你恐怕感兴趣的稿子:

  • 如何让页面加载成功后试行js
  • 页面加载完后活动实行一个办法的js代码
  • 页面加载成功后再执行JS的jquery写法以及界不要表明
  • 消除用jquery load加载页面到div时,不执行页面js的标题
  • 分析页面加载与js函数的实践 onload or ready
  • JS完毕文书档案加载成功后进行代码
  • JavaScript达成当网页加载成功后实践钦定函数的秘技
  • 编写制定高质量的JavaScript 脚本的加载与实践
  • javascript页面加载完实践事件代码
  • Javascript 加载和试行-质量提升篇
  • 探析浏览器实践JavaScript脚本加载与代码推行顺序
  • javascript封装addLoadEvent实现页面同有时间加载实施七个函数的章程
TAG标签:
版权声明:本文由澳门新葡8455手机版发布于Web前端,转载请注明出处:onload事件不起功效示例解析,Javascript代码在页面