浏览器DOM事件触发
除用户人为交互触发事件外,用js脚本触发事件的一般流程为
- 创建事件
var e = Event('event_name', {key: value, ...}) - 分发事件到
event.target - 触发事件处理函数
EventHandler
示例
<select >
<option value="all" selected>all</option>
<option value="active">active</option>
<option value="completed">completed</option>
</select>
<script>
let select = document.getElementsByTagName('select')[0];
select.onchange = handleChange;
function handleChange(e){
console.log('changed');
}
</script>
如上脚本中的 change 事件脚本触发的方式如下:
var e = Event('change', {bubbles: true});
select.options[1].dispatchEvent(e);
浏览器DOM事件触发的更多相关文章
- 针对focus和blur的Dom事件触发顺序
Dom事件触发顺序,拿文本框举例: 它会先触发focus事件,之后才会触发在有交点之后才能触发的一些如 click change 等事件(但如果有mousedown则先执行). 而相对于blur而言 ...
- 面试整理之DOM事件阶段
因为快面试了,打开<JavaScript高级程序设计>,对DOM事件进行整理了下 本文主要解决的问题: 事件流 DOM事件流的三个阶段 先理解流的概念 在现今的JavaScript中随处可 ...
- 整理之DOM事件阶段、冒泡与捕获、事件委托、ie事件和dom模型事件、鼠标事件
整理之DOM事件阶段 本文主要解决的问题: 事件流 DOM事件流的三个阶段 先理解流的概念 在现今的JavaScript中随处可见.比如说React中的单向数据流,Node中的流,又或是今天本文所讲的 ...
- js事件对象--DOM中的事件对象/IE中的事件对象/跨浏览器的事件对象
事件对象 在触发DOM上的某个事件时,会产生一个事件对象event,这个对象中包含着所有与事件有关的信息.包括导致事件的元素.事件的类型,以及其他与特定事件相关的信息.例如,鼠标操作导致的事件对 ...
- event.target 属性返回哪个 DOM 元素触发了事件。
<ul> <li>list <strong>item 1</strong></li> <li><span>list ...
- DOM事件监听和触发
EventTargetAPI定义了DOM事件(mouse事件等)的监听和触发方法,所有的DOM节点都部署了这个接口. 这个接口有三个方法:addEventListener, removeEventLi ...
- DOM 事件深入浅出(二)
在DOM事件深入浅出(一)中,我主要给大家讲解了不同DOM级别下的事件处理程序,同时介绍了事件冒泡和捕获的触发原理和方法.本文将继续介绍DOM事件中的知识点,主要侧重于DOM事件中Event对象的属性 ...
- DOM 事件深入浅出(一)
在项目开发时,我们时常需要考虑用户在使用产品时产生的各种各样的交互事件,比如鼠标点击事件.敲击键盘事件等.这样的事件行为都是前端DOM事件的组成部分,不同的DOM事件会有不同的触发条件和触发效果.本文 ...
- DOM事件
在慕课网上学习了DOM事件探秘课程,特此整理了一下笔记. 慕课网DOM事件探秘课程地址:http://www.imooc.com/learn/138 事件 是文档或浏览器窗口中发生的特定的交互瞬间.[ ...
随机推荐
- web前端常用代码于面试等资源
https://www.cnblogs.com/moqiutao/p/4766146.html
- 关于java做题时需要注意的事项
1.要熟悉eclipse的使用 2.用java提交时只能有一个public class 且类名只能为Main 3.提交时不能提交包名 4.提交时要将引入的包一起提交 5.虽然java提供了很多的函数, ...
- django CBV基于类视图简单实例
URLS: from django.contrib import admin from django.urls import path from cmbd import views urlpatter ...
- ThreadLocal的学习
一 用法ThreadLocal用于保存某个线程共享变量:对于同一个static ThreadLocal,不同线程只能从中get,set,remove自己的变量,而不会影响其他线程的变量.1.Threa ...
- Bootice1.34版本把grub4dos0.46a写入硬盘MBR失败一个例子
Bootice1.34版本把grub4dos0.46a写入硬盘MBR失败一个例子 一个同事的台式机,BIOS启动,500GB硬盘,分了四个MBR分区,C盘是激活的主分区,第二个分区50 ...
- springboot+mockito 异常解决方案
系统启动的异常日志如下 javax.net.ssl.* java.lang.IllegalStateException: Failed to load ApplicationContext at or ...
- python3学习笔记六(元组)
元组 创建空元组 tup1 = () #空元组print(type(tup1))print(tup1) tup2 = (10)tup3 = (10,)print(type(tup2)) #不加逗号,类 ...
- VMware Workstation 11 搭建windows server 2012 之sql server 2012集群常见问题整理
1.windows server 2012内置支持iSCSI发起程序无需额外安装,iSCSI Software Target 可作为“文件和存储服务”角色下的内置功能使用 2.拷贝虚拟机的文件加入域时 ...
- java多线程中并发集合和同步集合有哪些?区别是什么?
java多线程中并发集合和同步集合有哪些? hashmap 是非同步的,故在多线程中是线程不安全的,不过也可以使用 同步类来进行包装: 包装类Collections.synchronizedMap() ...
- REST framwork之解析器
一 我们首先要知道解析器是什么以及他的功能: REST framework 包含许多内置的解析器类,允许接受各种媒体类型(media types)的请求.还支持自定义解析器,这使你可以灵活地设计 AP ...