Javascript 笔记与总结(2-16)事件对象

事件对象:事件发生的瞬间,发生位置、时间、鼠标按键、触发的节点等信息,被打包成一个对象,此对象,系统自动传递给事件函数的第一个参数

【例】记录 鼠标划过图片时的事件对象

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <img src="a.bmp" width="300" alt="">
</body>
<script>
    document.getElementsByTagName("img")[0].onmouseover = function(e){
        console.log(e);
    }
</script>
</html>      

此时 控制台 输出:

其中 target(IE 用的是 srcElement,标准 Event 属性是 target) 表示触发事件时的触发对象。

另,以下写法是因为在 IE 低版本下,事件对象并不是放在事件函数的第一个参数中,而是放在 window 的 event 属性中:

    document.getElementsByTagName("img")[0].onmouseover = function(e){
        e = window.event || e;
    }
时间: 2025-01-06 03:53:18

Javascript 笔记与总结(2-16)事件对象的相关文章

笔记-【3】-event事件对象的详解!

event事件对象:是指当前对象发生的事件的一些详细的信息在event这个对象里. event对象从哪里来?从事件函数中传入 obj. //e就会当前的事件对象event } 对象就有属性和方法:那么event对象也有属性和方法 event的属性和方法: { 属性: button :  当前事件的方法中判断鼠标的按键位置 有三个值: 0 (左键) 1(滚轮) 2(右键) ctrlkey:  判断是否按下了ctrl键; altkey:  判断是否按下了alt键; shiftkey:  判断是否按下

Javascript 笔记与总结(1-6)Javascript 面向对象

在 JavaScript 中,有对象,没有类(但有构造函数). 在 JavaScript 中,对象不依赖于类而存在,可以直接生成. {key:value, key:value} 这种格式的对象,成为 json 格式的对象. 例: <script> var obj = {}; var obj2 = {key:1}; var obj3 = { key:1, key2:function(){ alert('hello world'); }} console.log(obj, obj2, obj3);

Javascript 笔记与总结(2-8)对象2

注意:标签属性与 DOM 对象属性的对应关系,绝大部分 2 者是相同的,例如 imgobj.src 属性对应 <img src=""> 中的 src 属性 例外:<div class="">中操作 class 属性用 divobj.className css 属性与 DOM 对象属性的对应关系,2 者通过 obj.style.css 属性名相对应,例如: obj.style.width obj.style.background 如果 css

Javascript 笔记与总结(2-7)对象

html: <h1>找对象</h1> <div id="div1"> <p>p1</p> <p>p2</p> <p>p3</p> </div> <div class="div2"></div> <input type="text" name="username"> js:

JavaScript权威设计--事件冒泡,捕获,事件句柄,事件源,事件对象(简要学习笔记十八)

1.事件冒泡与事件捕获 2.事件与事件句柄 3.事件委托:利用事件的冒泡技术.子元素的事件最终会冒泡到父元素直到跟节点.事件监听会分析从子元素冒泡上来的事件. 事件委托的好处: 1.每个函数都是对象,都会占用内存,内存中对象越多,性能越差. 2.必须事先指定所有事件处理程序而导致的DOM访问次数,会延迟整个页面的交互就绪时间. 怎样处理由于事件较多引起的性能差: 1.采用事件委托技术,限制简历的连接数量 2.在不需要的时候移除事件处理程序 例子: html: <div id="myDiv&

javascript event(事件对象)详解

1. 事件对象 thead>tr>th,.table>tbody>tr>th,.table>tfoot>tr>th,.table>thead>tr>td,.table>tbody>tr>td,.table>tfoot>tr>td{padding:8px;line-height:1.45;vertical-align:top;border-top:1px solid #ddd}.table>thead

JavaScript事件---事件对象

原文:JavaScript事件---事件对象 发文不易,若转载传播,请亲注明出处,谢谢!   内容提纲: 1.事件对象 2.鼠标事件 3.键盘事件 4.W3C与IE JavaScript事件的一个重要方面是它们拥有一些相对一致的特点,可以给你的开发提供更多的强大功能.最方便和强大的就是事件对象,他们可以帮你处理鼠标事件和键盘敲击方面的情况,此外还可以修改一般事件的捕获/冒泡流的函数. 一.事件对象 事件处理函数的一个标准特性是,以某些方式访问的事件对象包含有关于当前事件的上下文信息. 事件处理三

JavaScript事件对象与事件处理程序

在学习之前建议请看一下事件流.事件冒泡.事件捕获 一.事件对象 事件对象:在DOM触发事件时,会产生一个事件对象event,这个事件对象包含着所有与事件相关的信息.既然event是事件对象,那么它必然存在属性 ①DOM中的事件对象event属性   (1).type属性用于获取事件类型   (2).target.srcElement<兼容IE事件>属性用于获取事件目标    (3).stopPropagation()方法 用于阻止事件冒泡   (4).preventDefault() 方法 阻

Javascript 事件对象(六)键盘事件

keyCode获取用户按下键盘的哪个按键 1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 5 <title>无标题文档</title> 6 <script> 7 /* 8 onkeydown : 当键盘按键按下的时候触发