js事件、Js中的for循环和事件的关系、this
一、js事件
1、事件
用户在网页中所触发的行为
鼠标滑动种类很多,键盘、表单特列;
点击:onclick
鼠标进入:onmouseenter 鼠标离开:onmouseleave
鼠标悬浮:onmouseover 鼠标移除:onmouseout
鼠标按下:onmousedown 鼠标抬起:onmouseup
鼠标移动:onmousemove
表单聚焦:onfocus 表单失去焦点:onblur
浏览器加载完成:onload
js事件是一直存在的,可以绑定方法,也可以不绑定,如果没有绑定,事件都会发生,只是这个事件什么都没有,可以给相应的元素绑定事件和方法
div . onclick=fiunction(){ } 点击div时就触发了函数中的代码块
2、事件对象
一个事件触发获得的所有信息都在事件对象中保存着
3、事件源 event . target
鼠标点在谁的身上,谁就是事件源
4、事件的使用方法
(1)、事件 将事件当做标签属性使用
eg:<img src="img/01.jpg" alt=" " onclick=alert(456)>
(2)、通过事件绑定 将事件当成一个元素的属性
eg:pic [0] . onclick=function() {
alert(456)
}
二、Js中的for循环和事件的关系
事件的执行和for循环没有关系,都是相互独立的。
1、解决事件中的i和for匹配
方法一:给事件套一个自调用函数
for (var i=0;i<arr.length;i++){
(finction (i) {
lis [ i ] .onlick=function ( ) {
tupian.src=arr [ i ]
}
})
}
方法二:人为定义属性,将索引在属性里需要的时候,调用属性(用this)
for (var i=0;i<arr.length; i++){
lis[ i ].index=i;
lis [ i ].onclick=function () {
tupian.src=arr [ this.index ]
}
}
三、this
This 是js的一个关键字,他是一个对象,一般用在函数里用于指向函数内部的关系。
Div.onclick=function(){this}
如果函数在定义的时候前面有.,那么this就指向点前面的对象。
fn()
如果函数定义时没有. 那么this就是window
js事件、Js中的for循环和事件的关系、this的更多相关文章
- js jq输入框中按回车触发提交事件,用户在页面输入后按回车(Enter键)进行
js jq输入框中按回车触发提交事件,用户在页面输入后按回车(Enter键)进行 代码如下: <!DOCTYPE html> <html lang="en" xm ...
- js中当for循环中有事件要使用循环变量时,变量用var声明和let声明的区别
var 声明一个全局变量,声明的变量会变量提升: let 声明一个局部变量: 当页面加载完后,for循环也结束了,如果用var声明的变量此时也随着for循环的结束而自增到满足结束循环的条件, 此时调用 ...
- 为什么js 的constructor中是无限循环嵌套:Foo.__proto__.constructor.prototype.constructor.prototype.constructor.prototype.xxx ?
constructor始终指向创建当前对象实例的(构造)函数. 任何函数都是Function类的一个实例 那么根据上述可知:任何函数的constructor属性都指向Function类,而Functi ...
- Zepto.js touch模块深入分析 解决手机点击事件
源码: // Zepto.js // (c) 2010-2015 Thomas Fuchs // Zepto.js may be freely distributed under the MIT li ...
- js和jquery中的事件委托
[转+自己的修改] 概念: 什么是事件委托:通俗的讲,事件就是onclick,onmouseover,onmouseout,等就是事件,委托呢,就是让别人来做,这个事件本来是加在某些元素上的,然而你却 ...
- JS给元素循环添加事件的问题
<ul> <li>男</li> <li>女</li> <li>老</li> <li>少</li&g ...
- js闭包理解案例-解决for循环为元素注册事件的问题
转发自http://www.ruanyifeng.com/blog/2009/08/learning_javascript_closures.html 一.变量的作用域 要理解闭包,首 ...
- JS和jQuery中的事件总结(一)
学而时习之,小白现在天天写页面,基础知识还是要恶补的. 进入正题,什么是事件(此处单独对jQuery.JS)?就是JS和Html之间的交互时呢,用户和浏览器操作页面时的动作(其实是为引发的效果的执行操 ...
- js和jquery中的触发事件
改别人的坑,遇到jquery选择器和fireEvent混用,不认识fireEvent方法报错. js的方法不能使用jquery的选择器去调用. 1.fireEvent (IE上的js方法 ) 我们来看 ...
随机推荐
- 网络转载:局域网安全:解决ARP攻击的方法和原理
局域网安全:解决ARP攻击的方法和原理 IT世界网2006-01-26 10:17 [故障原因] 局域网内有人使用ARP欺骗的木马程序(比如:传奇盗号的软件,某些传奇外挂中也被恶意加载了此程序). ...
- 集合框架、泛型、迭代(java基础知识十六)
1.ArrayList存储自定义对象并遍历 此类的 iterator 和 listIterator 方法返回的迭代器是快速失败的:在创建迭代器之后,除非通过迭代器自身的 remove 或 add 方法 ...
- MySQL性能优化-I/O相关配置参数
本文介绍InnoDB和MyISAM两种存储引擎的I/O相关参数配置. 1.InnoDB I/O相关配置 Innodb是一种事务型的存储引擎,为了减少提交事务时产生的io开销,innodb采用了写日志 ...
- html5--6-3 CSS语法2
html5--6-3 CSS语法2 实例 div包含p和h标签的时候可以,但是p标签包含h标签的时候不可以 学习要点 掌握引入外部样式表方法 插入样式的三种方法 内联样式表(行内) 内部样式表(st ...
- Java 给Thread传递参数
一开始我想把run()函数写成有参函数来传值,后来发现行不通.经过查找,最终用如下方法传递了参数: 也就是用另外一个有参函数setTar()传递参数. 调用的时候用这4行code传递参数: 上面是用i ...
- Android 获取View宽度
/***************************************************************************** * Android 获取View宽度 * ...
- [Selenium] 使用Firefox Driver 示例
//导入Selenium 库和FirefoxDriver 库 package com.learningselenium.simplewebdriver; import org.openqa.selen ...
- mack pro常用快捷键
fn + left / right / up / down 相当于 home/end/page up /page down delete 删除光标前一个字符 fn + delete 删除当前光标后一个 ...
- Codechef QGRID
QGRID code 给定一个 n × m(1 <= m <= 3) 的点网格,网格的边上以及点上都有权值.初始时所有点的权值都为 0 .维护两种操作:1. x1 y1 x2 y2 c 把 ...
- B - Preparing Olympiad
Time Limit:2000MS Memory Limit:262144KB 64bit IO Format:%I64d & %I64u Description You ha ...