onload事件,顾名思义就是为了js程序能够在网页加载成功过后进行执行。对于放在head里面的js来说,非常必要。

如何给网页绑定onload,主要有三种方式:

window.onload=function(){//要执行的代码}

window.addEventListener('load',函数名,false)

body中添加属性<body onload="函数名()">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>绑定onload几种方法</title>
<script>
alert('我最先被执行');
//这种方法仅能在页面加载后执行一个函数(其他函数通过该函数调用)
window.onload=function(){alert(document.getElementById('e').getAttribute('id'));}
</script>
<script>
if(document.all)//在IE中返回真
window.attachEvent('onload',add);//IE浏览器用这个方法
else
window.addEventListener('load',add,false);//其他浏览器用这个方法
if(document.all)//在非IE中返回假
window.attachEvent('onload',jian);
else
window.addEventListener('load',jian,false);//addEventListener方法给load事件绑定函数
function add(){alert('1+2的值为3!');}
function jian(){alert('3-2的值为1!');}
function cheng(){alert('3*5的值为15!');}//这个函数是通过行间调用的
</script>
</head>
<body onload="cheng();"><!--经过测试,IE中,body里面的onload会在其他load之前执行,并且,
会覆盖window.onload方法,使其不能执行;-->
<span id="e">hehe</span>
<script>
if(document.all)//在IE中返回真
window.attachEvent('onload',last);//IE浏览器用这个方法
else
window.addEventListener('load',last,false);//其他浏览器用这个方法
function last(){alert('我最后被执行!!!');}
</script>
</body>
</html>

javascript中onload事件如何绑定及执行顺序的更多相关文章

  1. JavaScript 中 onload 事件绑定多个方法的优化建议

    页面加载完毕时会触发 onload 事件.基于内容(HTML)要与行为(JavaScript)分离的编码思想,我们需要将一些对页面的初始化操作写在方法内,并通过window.onload = func ...

  2. JavaScript 中 onload 事件绑定多个方法

    当需要调用的方法较多时,我们可以进一步优化,编写一个专门用于绑定 onload事件的方法: function addLoadEvent(func) { //把现有的 window.onload 事件处 ...

  3. JavaScript 中 OnLoad事件用法总结

    还差一天现在手头上的这套网站就写完了,中午蹭了半天还是没睡好,干脆爬起来把今天上午写到的onload事件给整理一下. 一般用到比较多的就是初始化数据或者效果. 1.直接写在<body>标签 ...

  4. js实例分析JavaScript中的事件委托和事件绑定

    我们在学习JavaScript中,难免都会去网上查一些资料.也许偶尔就会遇到“事件委托”(也有的称我“事件代理”,这里不评论谁是谁非.以下全部称为“事件委托”),尤其是在查JavaScript的事件处 ...

  5. javascript 中的事件机制

    1.javascript中的事件. 事件流 javascript中的事件是以一种流的形式存在的. 一个事件会也有多个元素同时响应. 有时候这不是我们想要的效果, 我们只是需要某个特定的元素相应我们的绑 ...

  6. 了解javascript中的事件(二)

    本文目录如下: 零.寒暄 一.事件的分类 二.事件代理 2.1 问题引出 2.2 什么是事件代理 2.3 完整示例 二.事件代理 三.事件代理思想的用处 四.总结 零.寒暄 这篇博客本该出现在两个月以 ...

  7. java基础66 JavaScript中的事件、localtion对象、screen对象(网页知识)

    1.JavaScript中的事件注册 1.1.事件的注册方式 方式1:直接在html元素上注册 <body onLoad="ready()"></body > ...

  8. JavaScript中的事件委托机制跟深浅拷贝

    今天聊下JavaScript中的事件委托跟深浅拷贝 事件委托 首先呢,介绍一下事件绑定 //方法一:通过onclick <button onclick="clickEvent()&qu ...

  9. Javascript中常用事件集合和事件使用方法

    Javascript中常用事件集合和事件使用方法 一.事件绑定 格式: 事件源 . on事件类型=事件处理函数 事件绑定三要素 1.事件源:和谁绑定 2.事件类型:什么事件 3.事件处理函数:触发了要 ...

随机推荐

  1. 2 Egg Problem

    继续我们的推理问题之旅,今天我们要对付的是一个Google的面试题:Two Egg Problem. 我们开始吧! No.2  Google Interview Puzzle : 2 Egg Prob ...

  2. NDO to PNP( ndoutils to PNP4Nagios)

    How to use this script The aim of this script is to import your ndo database directly into PNP4nagio ...

  3. 转: unix实际用户ID和有效用户ID解析

    今天在看APUE,这两个问题很难理解,GOOGLE一下,有篇文章总结的不错,看了一下才明白透彻了. 由于用户在UNIX下经常会遇到 SUID.SGID的概念,而且SUID和SGID涉及到系统安全,所以 ...

  4. 删除表空间的时候遇到的问题:ORA-02429: 无法删除用于强制唯一/主键的索引

    今天打算删除orcale数据库中无用的表空间,发现报错,查资料删除,写个过程留着备用.1.drop tablespace dldata INCLUDING CONTENTS CASCADE CONST ...

  5. oracle 数据库的学习1

    1.oracle 数据库常用的基本类型 char(10)  -->存储固定长度的字符串 varchar2(10)-->存储可变长的字符串 Date INTEGER -->存储整数 N ...

  6. 利用C++不使用递归,循环和goto,打印1到100 的某一答案分析

    实验环境是在64位linux下使用g++编译器    下面是Mark Gordon的答案   The below one works on my system, can't guarantee res ...

  7. 三、HTTP抓包测试

    package testHTTP; import java.io.BufferedReader;import java.io.IOException;import java.io.InputStrea ...

  8. JavaScript 数组冒泡排序练习

    12.29下午主要讲的是简单的一维数组 和数组中利用冒泡排序排列大小 比如有 数字 0.5  20   1   5   4   3   6   利用冒泡排序按照从小到大的顺序排列 var arr=ne ...

  9. ASP.NET ZERO 学习 HangFire的使用二

    之前在ABP配置好了HangFire环境之后,那么如何才能添加Job到HangFire中让其执行呢 这就需要参考ABP的Background Jobs and Workers, 参考路径:http:/ ...

  10. java_method_下拉框成json

    List<String[]> proList=service.getUserList(); int nTotal=0; String proJson="["; proJ ...