在各种浏览器中存在三种事件模型:原始事件模型,DOM2事件模型,IE事件模型。其中原始的事件模型被所有浏览器所支持,而DOM2中所定义的事件模型目前被除了IE以外的所有主流浏览器支持。

  浏览器事件模型分为三个阶段

  1.捕获阶段

  2.目标阶段

  3.冒泡阶段

  DOM节点获取方法:

  1.通过id获取  document.getElementById()

  2.通过name属性获取  document.getElementsByName()

  3.通过标签名获取   document.getElementsByTagName()

  4.通过class属性获取   document.getElementsByClassName()

  5.原生js中的querySelector  和   qureySelectorALL方法也是同样可以获取相应的dom节点,相似与jQuery,但比jq更快

简单概括下浏览器事件模型,如何获得资源dom节点的更多相关文章

  1. React对比Vue(03 事件的对比,传递参数对比,事件对象,ref获取DOM节点,表单事件,键盘事件,约束非约束组件等)

    import React from 'react'; class Baby extends React.Component { constructor (props) { super(props) t ...

  2. Vue 双向数据绑定、事件介绍以及ref获取dom节点

    vue是一个MVVM的框架 M model V view MVVM  model改变会影响视图view,view改变会影响model 双向数据绑定必须在表单里面使用 //我发现在谷歌浏览器翻译后的网页 ...

  3. 简单概括下MongoDB 4.0 新特性

    (1)跨文档事务支持 (ACID) 首个支持跨文档事务的NoSQL云数据库,将文档模型的速度,灵活性和功能与ACID保证相结合.现在,使用MongoDB解决各种用例变得更加容易. (2)40%迁移速度 ...

  4. Javascript事件模型(一):DOM0事件和DOM2事件

    javascript事件模型,本文主要有以下内容: DOM0事件模型 DOM2事件模型  一.DOM0事件模型 早期的事件模型称为DOM0级别. DOM0的事件具有极好的跨浏览器优势, 会以最快的速度 ...

  5. 理解javascript中的事件模型

    javascript中有两种事件模型:DOM0,DOM2.而对于这两种的时间模型,我一直不是非常的清楚,现在通过网上查阅资料终于明白了一些. 一.  DOM0级事件模型 DOM0级事件模型是早期的事件 ...

  6. javascript中0级DOM和2级DOM事件模型浅析

    Javascript程序使用的是事件驱动的设计模式,为一个元素添加事件监听函数,当这个元素的相应事件被触发那么其添加的事件监听函数就被调用: <input type="button&q ...

  7. 轻松学习JavaScript二十七:DOM编程学习之事件模型

    在介绍事件模型之前,我们先来看什么是事件和什么是event对象. 一事件介绍 JavaScript事件是由訪问Web页面的用户引起的一系列操作,使我们有能力创建动态页面.事件是能够被 JavaScri ...

  8. javascript中0级DOM和2级DOM事件模型浅析 分类: C1_HTML/JS/JQUERY 2014-08-06 15:22 253人阅读 评论(0) 收藏

    Javascript程序使用的是事件驱动的设计模式,为一个元素添加事件监听函数,当这个元素的相应事件被触发那么其添加的事件监听函数就被调用: <input type="button&q ...

  9. jQuery (01) 浏览器的事件模型

    浏览器的事件模型 由网景公司引入的 DOM0 级事件模型 把事件处理程序绑定到 DOM 元素的属性上: ele.onclick(); ele.onDOMContentLoad(); ele.onloa ...

随机推荐

  1. Py修行路 python基础 (四)运算 copy

    字符串的格式化 在字符串中插入 %s ,作为占位符,后边儿再定义插入变量. 算术运算 % 取模   判断奇偶数 / 除法   有小于号 // 取整除  返回整数部分 逻辑运算 and or not ' ...

  2. 简单的方法实现仿微信底部的Tab选项卡界面

    在网上看了比较多的关于Tab的教程,发现都很杂乱.比较多的用法是用TitlePagerTabStrip和ViewPaper.不过TitlePagerTabStrip有个很大的缺陷,Tab里面的内容刚进 ...

  3. JAVA的对称加密算法AES——加密和解密

    出自: http://blog.csdn.net/hongtashan11/article/details/6599645 http://www.cnblogs.com/liunanjava/p/42 ...

  4. android解析xml文件的方式

    android解析xml文件的方式   作者:东子哥 ,发布于2012-11-26,来源:博客园   在androd手机中处理xml数据时很常见的事情,通常在不同平台传输数据的时候,我们就可能使用xm ...

  5. Perl基础语法

    一.脚本文件perl 代码可以写在一个文本文件中,以 .pl..PL 作为后缀.文件名可以包含数字,符号和字母,但不能包含空格,可以使用下划线(_)来替代空格.一个简单的Perl 文件名:rurun_ ...

  6. SKNode的渲染顺序

    [SKNode的渲染顺序] SKNode的zPosition属性,指定相对于其父视图的z轴坐标. The default value is 0.0. The positive z axis is pr ...

  7. Leetcode:ZigZag Conversion分析和实现

    问题的大意就是将字符串中的字符按锯齿状(倒N形)垂直由上向下放置,最后水平从左向右读取.比如 ABCDEFGHIJKLMN,4表示 A          G      M B      F  H    ...

  8. 【总结整理】OpenLayers项目分析,OpenLayers中的图层,GeoServer发布wms服务--实验(转)

    https://blog.csdn.net/u013751758/article/details/44751315 https://blog.csdn.net/u013751758/article/d ...

  9. ubuntu安装软件包apt-get和dpkg方法

    1apt方法 安装软件 apt-get install softname1 softname2 softname3…… 卸载软件 apt-get remove softname1 softname2 ...

  10. FreeMarker 的空值处理 , 简单理解 , 不用TMD就会忘记

    NO.1 而对于FreeMarker来说,null值和不存在的变量是完全一样的 NO.2 ! 指定缺失变量的默认值 返回String NO.3 ?? 判断变量是否存在 返回boolean NO.4 $ ...