Click--点击事件

优先级：dom.onclick 高于标签上的onClick属性

监听事件 --不会覆盖前面的事件效果

dom.addEventListener()    括号里面有三个参数

1.事件类型  2.回调函数，执行事件后触发的操作 3.决定事件是冒泡还是捕获  默认值是false（冒泡） true（捕获）

事件冒泡：事件从内部像外传播，外层元素如果有相同的事件，也会触发　　

通过innerHTML改变元素内容时，会清除内部原有的绑定事件。

循环绑定事件时，动态添加的元素没有事件

事件委托

将子元素的事件委托给父元素执行，父元素执行事件时，通过事件对象Event，来判断是哪个子元素触发的事件（事件源）

<body>

<ul id="list"></ul>

</body>

<script>
var list=document.getElementById('list');
list.addEventListener("click",function(e){
//e.target e.srcElement src=source
//触发事件的子元素，就是e.srcElement
if (e.srcElement.tagName=="BUTTON") {
e.srcElement.parentNode.remove();
}
})
</script>

mouseover 鼠标经过
mouseout 鼠标移出

mouseenter 鼠标进入
mouseleave 鼠标离开

JS中dom操作的事件的更多相关文章

  1. 5月16日上课笔记-js中DOM操作

    一.DOM操作 DOM节点的操作 增加 删除 修改 节点的信息: nodeName 获取节点的标签名 parentNode 获取父节点 childNodes IE忽略回车换行,chrome回车换行是文 ...

  2. JS的DOM操作及动画

    JS的DOM操作DOM:Document Object ModelBOM:Bowers(浏览器) Object Model找到元素:var a=document.getElementById(&quo ...

  3. jQuery学习笔记之DOM操作、事件绑定（2）

    jQuery学习笔记之DOM操作.事件绑定(2) --------------------学习目录------------------------ 4.DOM操作 5.事件绑定 源码地址: https ...

  4. JS的DOM操作语法

    整理了一下JS的DOM操作语法,这里做下记录. <!DOCTYPE html> <html> <head> <meta charset="utf-8 ...

  5. js的dom操作（整理）（转）

    js的dom操作整理(整理)(转) 一.总结 一句话总结: dom操作有用原生js的dom操作,也可以用对js封装过的jquery等插件来来更加方便的进行dom操作 1.dom是什么? 对于JavaS ...

  6. js的DOM操作整理（整理）

    js的DOM操作整理(整理) 一.总结 一句话总结: dom操作有用原生js的dom操作,也可以用对js封装过的jquery等插件来更加方便的进行dom操作 1.dom是什么? 对于JavaScrip ...

  7. js中如何操作json数据

    一.要想熟练的操作json数据,就先要了解json数据的结构,json有两种结构:对象和数组. 1.对象 一个对象以“{”开始,“}”结束.每个“名称”后跟一个“:”:“‘名称/值’ 对”之间使用“, ...

  8. js中的点击事件（click）的实现方式

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  9. Js为Dom元素绑定事件须知

    为异步加载的Dom 元素绑定事件必须在加载完成之后绑定: $('body').load('LearnClickBinding.ashx');$('a').click(function () { ale ...

随机推荐

  1. cookie & maxAge & expires

    cookie & maxAge & expires Expires (timestamp) & Max-Age (seconds) https://developer.mozi ...

  2. Android 获取apk的URL Schemes

    1. 下载apk到你的PC上 2. 反向工程Android APK文件的工具 Apktool 3. 查看"AndroidManifest.xml"文件 See alse: http ...

  3. regex read once bug

    regex read once bug read once bug StackOverflow Question https://stackoverflow.com/questions/5916796 ...

  4. Flutter Android Toast Message(flutter访问Android Toast Message)

    原文 Android Toast通知可用于向用户发送快速消息,并在几秒钟后消失. 但是当涉及Flutter时,没有直接的方式来显示这些Toast消息.因此,我们需要找到一种替代方法来实现它.在这种情况 ...

  5. 2021，狗狗币暴涨，VAST更加疯狂！

    2021年的币圈,多多少少出乎人的意料.很多币圈玩家们看好比特币,比特币却在达到4万美金的巅峰之后,极速下滑.很多玩家们看好以太坊,以太坊的手续费却出现了飙涨,让众多的中小散户们再次退却.而前几年已经 ...

  6. 超强嘉宾阵容——NGK Global启动大会圆满举办

    近日,由星盟全球投资公司.灵石团队联合主办的NGK Global全球生态启动大会圆满开幕.大会汇集区块链领域.金融领域.密码学领域.智能算法领域等众多大咖,和NGK Global全球价值共识者共聚一堂 ...

  7. Mac mini M1使用简单体验(编程、游戏、深度学习)

    好久不见了各位! 前一阵子忍不住剁手买了M1芯片的mac mini,为了弥补自己的内疚感就卖了自己的旧的mbp2017款.数据也完全迁移到了新机器上,之前的工作也就由mbp2017彻底换成mac mi ...

  8. 从几个问题开始理解CFS调度器

    本文转载自从几个问题开始理解CFS调度器 导语 CFS(完全公平调度器)是Linux内核2.6.23版本开始采用的进程调度器,它的基本原理是这样的:设定一个调度周期(sched_latency_ns) ...

  9. mysql 8.0.18 小白安装教程

    1. 下载 官网下载:https://dev.mysql.com/downloads/mysql/ 嫌官网网速慢可以加q群,在群文件里下载: 1.下载第一个download 2.解压在自己建的目录(各 ...

  10. docker仓库之分布式harbor (一)

    1.harbor介绍 harbor是一个用于存储和分发docker镜像的企业级Registry服务器,由VMware开源.其通过添加一些企业必须的功能特性,例如安全,标识和管理,扩展了开源docker ...