DOM0级事件绑定之js的onclick事件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<body>
<form action="">
<input type="text" name="username">
<input type="button" id="btn" value="click me" this="32" event="sd">
</form>
</body>
<script>
document.getElementById('btn').onclick = function () {
console.log(Array.prototype.slice.call(arguments)); // [MouseEvent] ie8及以下为空
console.log(this); // 该input对象
console.log(event); // 该点击事件
console.log(this.form); // input所在的表单对象
console.log(this.form.username.value); // 用户名input输入的值
}
</script>
</html>
1、通过此方法绑定的事件,作用域是该元素对象;
2、多次绑定的事件,后面定义的覆盖之前的事件;
3、此方法绑定的事件在事件流中的冒泡过程中触发。
DOM0级事件绑定之js的onclick事件的更多相关文章
- js、jq事件绑定方式总结——以click事件为例
一.JavaScript点击事件绑定方法 1.1 HTML onclick事件属性 <button onclick="clickMe(this)">click me&l ...
- jQuery 学习笔记(5)(事件绑定与解绑、事件冒泡与事件默认行为、事件的自动触发、自定义事件、事件命名空间、事件委托、移入移出事件)
1.事件绑定: .eventName(fn) //编码效率略高,但部分事件jQuery没有实现 .on(eventName, fn) //编码效率略低,所有事件均可以添加 注意点:可以同时添加多个相同 ...
- js 中onclick 事件 点击后指向自己的对象,查找或者添加属性 用关键字this 传入参数 (可以改变原标签css)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- thymeleaf 传参到js的onclick事件中
html: <img th:onclick="'javascript:imgClick(\''+${card.id}+'\',\''+${card.name}+'\');'" ...
- js 增加 onclick 事件
obj.onclick = function(){check(this)} function check(obj){ alert(obj)l }
- JS中onclick事件传参
美术馆案例中,需要将“增加一个img标签,放入大图片”这样一个函数封装,但是在调用的时候需要传参. <script type="text/javascript"> on ...
- JS Event事件流(冒泡机制、捕获机制、事件绑定)
1.事件流 事件流:从页面中接收事件的顺序.也就是说当一个事件产生时,这个事件的传播过程,就是事件流. IE的事件流 IE中的事件流叫事件冒泡:事件冒泡:事件开始时由最具体的元素接收,然后逐级向上传播 ...
- JS基础——事件绑定
上一篇博客JS事件对象中,老师问JS事件处理和VB中的事件处理有什么联系?先来解决一下这个问题.举个VB.net中事件处理的样例(JS敲久了,VB习惯的都不熟悉了,看来得常常回想了): 1.事件处理V ...
- 关于js中对事件绑定与普通事件的理解
普通事件指的是可以用来注册的事件: 事件绑定是指把事件注册到具体的元素之上. 通俗点说: 普通事件:给html元素添加一个特定的属性(如:onclick): 事件绑定:js代码中通过标记(id ta ...
随机推荐
- DecimalFormat数字格式化
DecimalFormat可以按照需要格式化数字,下面简单介绍一下几种使用.其中自己也踏踏实实踩了坑,谨此记录. 保留位数设置 public class DecimalUtils { //保留2位,不 ...
- MAVEN项目标准目录结构(转)
转自:http://blog.csdn.net/lengyue_wy/article/details/6718637 版权声明:本文为博主原创文章,未经博主允许不得转载. 1.标准目录结构: s ...
- VUE前端面试题
什么是 mvvm? MVVM 是 Model-View-ViewModel 的缩写.mvvm 是一种设计思想.Model 层代表数据模型,也可以在 Model 中定义数据修改和操作的业务逻辑:View ...
- mysql中级操作
解析sql执行过程 show VARIABLES like '%profil%' //查看是否开启了剖析 如没开启set profiling=1; 启用 show profiles; set @que ...
- k8s-mysql搭建
安装官方文档https://kubernetes.io/docs/tasks/run-application/run-replicated-stateful-application/ 搭建完成,但是没 ...
- testNG 并发测试
invocationCount是并发数,threadPoolSize是线程数,当线程是1的时候就是依次执行n次,当线程是并发次数时,就是同时执行n次 @Test public void abc ...
- 数据结构---Java---String
1.概述 1.1 源码(JDK1.8) public final class String implements java.io.Serializable, Comparable<String& ...
- linux基础(六)
今天我们来看一下Samba服务和nginx服务. Samba服务 1.samba的功能 samba是一个网络服务器,用于Linux和Windows之间共享文件. 2.samba服务的启动.停止.重启 ...
- 区间第k大的几种解法
区间第K大问题,变化包括带修改和不带修改,强制在线和允许离线 修改主要是单点修改,我们前面也只讨论这种情况. 接下来我们从编程复杂度和时空复杂度来讨论几种做法. 1.整体二分(编程复杂度:低-中,时间 ...
- window环境mysql卸载不干净
停止MySQL服务1添加删除程序中卸载MySQL2到安装目录删除MySQL3删除:C:\Documents and Settings\All Users\Application Data\MySQL ...