一、loading——（用来加载位于网页中的文件，而非本地的）
例子：
<!doctype html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

</head>

<body>

    <div id="div1">loading...... <span id="span1">0%</span></div>

</body>

<script type="text/javascript">

    var arr=["http://h.hiphotos.baidu.com/image/pic/item/00e93901213fb80e6c1c307635d12f2eb8389445.jpg","http://e.hiphotos.baidu.com/image/pic/item/5882b2b7d0a20cf4d51141c275094b36acaf992e.jpg","http://f.hiphotos.baidu.com/image/pic/item/d62a6059252dd42aedabbeb6003b5bb5c9eab809.jpg"];

    var div1=document.getElementById("div1");

    var span1=document.getElementById("span1");

    var imgs=[];

    var index=0;

    for (var i=0; i<arr.length; i++){

        var imgObj=new Image();

        imgObj.src=arr[i];

        imgObj.onload=function (){

            index++;

            span1.innerHTML=parseInt(index/arr.length*100)+"%";

            imgs.push(this);

            if (index==arr.length){

                //全部加载完毕

                div1.innerHTML="";

                for (var j=0; j<arr.length; j++){

                    div1.appendChild(imgs[j]);

                }

            }

        }

    }

</script>

</html>
  • DOMContentLoaded：相当于onload
 
二、read——window.onload 比 HTML 部分加载速度快
  • window.onload:html,css,image,js,音频，flash
  • read:DOM,css
 
三、事件委托
  • e.target：触发的对象，上图为对象 ul1
  • e.target.tagname：获取事件源，触发的对象标签名，上图为ul1对应的标签
  • 兼容：
    • e.target：用于高级浏览器
    • e.srcElement：用于低级浏览器
 
四、传参
  • 方法一（最原始）
  • 方法二
  • 方法三
  • 方法四（最高端实用）
 

js事件3的更多相关文章

  1. dynamic-css 动态 CSS 库，使得你可以借助 MVVM 模式动态生成和更新 css，从 js 事件和 css 选择器的苦海中脱离出来

    dynamic-css 使得你可以借助 MVVM 模式动态生成和更新 css,从而将本插件到来之前,打散.嵌套在 js 中的修改样式的代码剥离出来.比如你要做元素跟随鼠标移动,或者根据滚动条位置的变化 ...

  2. 什么是JS事件冒泡？

    什么是JS事件冒泡?: 在一个对象上触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事件处理 程序或者事件返回true,那么 ...

  3. js事件技巧方法整合

    window.resizeTo(800,600); //js设置浏览器窗口尺寸 window.open (function(){ resizeTo(640,480);//设置浏览器窗口尺寸 moveT ...

  4. js事件浅析

    js中关于DOM的操作很多,因此js事件机制也就尤为重要. 事件绑定形式: 一. 内联形式 耦合度高,不利于维护 <button onclick="alert('你点击了这个按钮'); ...

  5. js 事件大全

    Js事件大全一般事件 事件 浏览器支持 描述onClick IE3|N2|O3 鼠标点击事件,多用在某个对象控制的范围内的鼠标点击onDblClick IE4|N4|O 鼠标双击事件onMouseDo ...

  6. 原生JS事件绑定方法以及jQuery绑定事件方法bind、live、on、delegate的区别

    一.原生JS事件绑定方法: 1.通过HTML属性进行事件处理函数的绑定如: <a href="#" onclick="f()"> 2.通过JavaS ...

  7. JS事件

    JS事件:  声明:为了事件对象event跨浏览器兼容: var oEvent==ev||event;      所以在下面用到 event 的地方都用 oEvent 代替  1)doucument的 ...

  8. 原生js事件和jquery事件的执行顺序问题

    场景:近日,写前端页面时候,在针对输入框input操作时,用到了jquery的插件,插件中使用了jquery的focus()和blur()方法.但是同时,又需要在插件之外再针对输入框的获取焦点和失去焦 ...

  9. 特殊js事件

    1:点击enter事件 $(document).keypress(function(e) { // 回车键事件 if(e.which == 13) { submitForm(); } }); 2:JQ ...

  10. js 事件

    事件:一般用于浏览器与用户操作进行交互 js事件的三种模型:内联模型.脚本模型.DOM2模型 内联模型:事件处理函数是HTML标签的属性 <input type="button&quo ...

随机推荐

  1. 按CTRL,SHIFT,ALT等键扩展easyui的datagrid多选实现

    //------------------------------------------------------------------------------- // 当然页面文件中还需要引入的文件 ...

  2. 谈谈分布式事务之一：SOA需要怎样的事务控制方式

    在一个基于SOA架构的分布式系统体系中,服务(Service)成为了基本的功能提供单元,无论与业务流程无关的基础功能,还是具体的业务逻辑, 均实现在相应的服务之中.服务对外提供统一的接口,服务之间采用 ...

  3. JSON字符串转换成JSON对象

    字符串转对象(strJSON代表json字符串) var obj = eval(strJSON); var obj = strJSON.parseJSON(); var obj = JSON.pars ...

  4. Java笔记(十一)……单例设计模式

    设计模式 解决某一类问题最行之有效的方法 Java中有23中设计模式 单例设计模式 解决一个类在内存中只存在一个对象 思路 将构造函数私有化 在类中创建一个本类对象 提供一个方法可以获取到对象 两种方 ...

  5. HDU 1114 iggy-Bank(完全背包)

    水 给出小猪钱罐的重量和装满钱后的重量,然后是几组数据,每组数据包括每种钱币的价值与重量 要求出重量最少能装满钱罐时的最大价值 #include<iostream> #include< ...

  6. HUD-4602 Partition 排列

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4602 把n等效为排成一列的n个点,然后就是取出其中连续的k个点.分两种情况,一种是不包含两端,2^( ...

  7. HDOJ(~1004)

    T1000 #include <stdio.h> int main() { int a, b; while (scanf("%d %d", &a, &b ...

  8. iframe与include的区别

    iframe与include区别和使用问题 1.iframe可以用在静态和动态页面,include只能用在动态页面. 2.iframe是视图级组合,include是代码级组合. 3.iframe独立成 ...

  9. Java 中 String 类和StringBuilder 类的常用方法

    String 类提供了许多用来处理字符串的方法,例如,获取字符串长度.对字符串进行截取.将字符串转换为大写或小写.字符串分割等,下面我们就来领略它的强大之处吧. String 类的常用方法: 结合代码 ...

  10. 第三步 用Jena自定义完成数据库到RDF的映射

    第三步 用Jena自定义完成数据库到RDF的映射 2013年10月17日 8:53:27 这一步用Jena编程,终于能做点有技术含量的事情了.这个工作计划本周内完成,下周一好给老师一个交待. 目标:把 ...