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 ...
随机推荐
- Centos6安装mysql5.7最新版
最近因为公司的服务器需要做基线和漏洞扫描,基线方面问题不大,按照报告上的加固建议,选一些权重高的问题处理一下就好了.但是漏洞扫描就比较坑了,扫出来了十几个高危和一百六十多个中危漏洞,不过还好漏洞基本上 ...
- find 文件查找
目录 find文件查找 1.为什么要使用文件查找 2.根据文件名称查找-name 3.根据文件大小查找-size 4.根据文件类型查找-type f 5.根据文件时间查找-mtime 6.根据文件用户 ...
- Linux: 给右键菜单加一个“转换图片为jpg格式”
Linux上通常都会安装imagemagick这个小巧但又异常强大的工具.这个软件提供了一系列很好用的功能.这里说一说如何使用它的convert命令转换图片为jpg格式,以及如何把它添加到Thunar ...
- 入门phantomjs
前言 phantomjs是一个无界面浏览器,用来操作web页面的一个工具,比如登录,提交表单等等. 语法框 //创建一个浏览器对象 var page = require('webpage').crea ...
- RecyclerView跳转到指定位置的三种方式
自从android5.0推出RecyclerView以后,RecyclerView越来越受广大程序员的热爱了!大家都知道RecyclerView的出现目的是为了替代listview和ScrollVie ...
- PHP+Redis 有序集合实现 24 小时排行榜实时更新
基本介绍 Redis 有序集合和集合一样也是 string 类型元素的集合,且不允许重复的成员. 不同的是每个元素都会关联一个 double 类型的分数.redis 正是通过分数来为集合中的成员进行从 ...
- sql中的(case when then else end )的用法（相当于java中的if else）
Case具有两种格式:简单Case函数和Case搜索函数. 1.简单Case函数: CASE sex WHEN‘1’THEN‘男’ WHEN‘0’THEN‘女’ ELSE‘其他’END 2.Case搜 ...
- [REPRINT]MySQL Indexing Explained
https://atech.blog/viaduct/mysql-indexes-primer What are Indexes? Every time your web application ru ...
- Hadoop（一）阿里云hadoop集群配置
集群配置 三台ECS云服务器 配置步骤 1.准备工作 1.1 创建/bigdata目录 mkdir /bigdatacd /bigdatamkdir /app 1.2修改主机名为node01.node ...
- Spring解决循环依赖
1.Spring解决循环依赖 什么是循环依赖:比如A引用B,B引用C,C引用A,它们最终形成一个依赖环. 循环依赖有两种 1.构造器循环依赖 构造器注入导致的循环依赖,Spring是无法解决的,只能抛 ...