事件:

1、注册事件

a. <div onxxxx=””></div>

b. document  .onxxxx= function()  //找到这个标签

2、this,触发当前事件的标签

3、event ,触发当前标签的事件内容

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div onmouseover="Func(this)" onmouseout="Func1(this)"> 123</div>
<input type="text" onkeydown="Down(this,event);">
<script>
function Down(ths,e) {
console.log(e.keyCode); }
function Func(ths) {
ths.style.color = 'red';
} function Func1(ths) {
ths.style.color = 'black'; }
function
</script> </body>
</html>

HTML学习1-Dom之事件绑定的更多相关文章

  1. 微信小程序学习笔记二 数据绑定 + 事件绑定

    微信小程序学习笔记二 1. 小程序特点概述 没有DOM 组件化开发: 具备特定功能效果的代码集合 体积小, 单个压缩包体积不能大于2M, 否则无法上线 小程序的四个重要的文件 *js *.wxml - ...

  2. 迷你MVVM框架 avalonjs 学习教程14、事件绑定

    之前的章节许多示例代码也或多或少地展示了如何使用ms-click来绑定事件了.能直接在模板上绑定是事件,这也是静态模板与动态绑定的一大区别.ms-click不是简单的onclick的别名,它在内部屏蔽 ...

  3. DOM常用事件绑定方式与实例

    一.常用的事件 onclick 点击事件 模态框实例 <input type="button" id="b1" style="width:50p ...

  4. DOM中事件绑定补充方法

    先将上一篇文章中提到的为元素增加事件的方法和移除事件的方法拿过来: <span style="font-size:18px;">//跨浏览器添加事件 function ...

  5. Shadow DOM的事件绑定

    好悲催,阴世界的事件对象跑到光世界时,它的属性都被重写了,要自己做备份. <div id="root">Hello, world!</div> <sc ...

  6. 5事件DOM零级事件跟DOM二级事件

    事件的行为传播,行为本身跟事件绑定没有关系:1.全新认识事件(某一个具体的行为)->行为本身:浏览器天生自带的一些行为操作->click,mouseover(mouseenter),mou ...

  7. ES之事件绑定,解除绑定以及事件冒泡、事件捕获

    绑定事件的处理方法任何元素都有事件属性,而绑定事件就是将这个事件与一个函数相连接. ①句柄事件dom.onXXX = function () {代码块} 以on开头的事件属于句柄事件兼容性非常好,但是 ...

  8. jQuery学习笔记之DOM操作、事件绑定(2)

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

  9. javaScript事件机制深入学习(事件冒泡,事件捕获,事件绑定方式,移除事件方式,阻止浏览器默认行为,事件委托,模拟浏览器事件,自定义事件)

    前言 JavaScript与HTML之间的交互是通过事件实现的.事件,就是文档或浏览器窗口中发生的一些特定的交互瞬间.可以使用侦听器(或处理程序)来预订事件,以便事件发生时执行相应的代码.这种在传统软 ...

  10. JQuery学习:事件绑定&入口函数&样式控制

    1.基础语法学习: 1.事件绑定 2.入口函数 3.样式控制 <!DOCTYPE html> <html lang="en"> <head> & ...

随机推荐

  1. 1834. [ZJOI2010]网络扩容【费用流】

    Description 给定一张有向图,每条边都有一个容量C和一个扩容费用W.这里扩容费用是指将容量扩大1所需的费用. 求:  1.在不扩容的情况下,1到N的最大流:  2.将1到N的最大流增加K所需 ...

  2. Linux无法识别Broadcom 802.11abgn无线网卡

    折腾了好久,都无法解决 索性后来直接使用的usb外置网卡,勉强能用(使用极其不便) 最后使尽浑身解数,冲着萤火般的希望,好在没有放弃 正解就是下面这   完成重启即可 sudo cp /sys/fir ...

  3. 理解Flux架构

    本文摘自<Flux架构入门教程>和<谈一谈我对 React Flux 架构的理解>.也有自己的观点和总结.转载请注明出处. 一.Flux架构描述 1. Flux是什么 Flux ...

  4. $Mayan$游戏

    \(Mayan\)游戏 好啊,一年(半年)来的梦魇,终于结束了. 其实我从来没料到整体竟然会如此暴力--做的时候机房里冷得很,感觉晕晕乎乎地做完了,晕晕乎乎地调了好久,晕晕乎乎地听(看了题解的)\(q ...

  5. (转)WebSocket的原理

    前言:无聊逛知乎,就逛到H5的栏目去了,正好看到了关于Websocket的东西.个人是比较喜欢看这类风格的,转到博客分享,以便自己以后理解. ---------------------分割线----- ...

  6. P2983 [USACO10FEB]购买巧克力Chocolate Buying

    题目描述 Bessie and the herd love chocolate so Farmer John is buying them some. The Bovine Chocolate Sto ...

  7. 串口调试助手vc源程序及其详细编写过程

    串口调试助手vc源程序及其详细编写过程   目次: 1.建立项目 2.在项目中插入MSComm控件 3.利用ClassWizard定义CMSComm类控制变量 4.在对话框中添加控件 5.添加串口事件 ...

  8. java crm 进销存 springmvc SSM 项目 源码 系统

    系统介绍: 1.系统采用主流的 SSM 框架 jsp JSTL bootstrap html5 (PC浏览器使用) 2.springmvc +spring4.3.7+ mybaits3.3  SSM ...

  9. 学习Java 采取令牌的方式避免重复提交

    重复提交原因 从提交页面到成功页面的跳转一般采用视图定位,由于视图定位是在服务端跳转的,如果用户在点击提交之后再次刷新页面,会导致重复提交,数据库的数据会有重复. 采用令牌措施 1.在转账展示页面生成 ...

  10. 【 腾讯敏捷转型No.4 】为什么敏捷团队不要超过15人

    早期,腾讯公司的架构是比较简单的.从上至下分别是:公司——商业单元(BU)——部门——组——员工,每个部门基本上就是负责一个大的产品,每个组都是按照专业进行分工和管理,例如:产品组.终端组.后台组.设 ...