Dom 里定义的onclick怎样传入event事件

最新推荐文章于 2025-08-28 11:59:41 发布
原创 最新推荐文章于 2025-08-28 11:59:41 发布 · 1.6w 阅读 · 4 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#JS #HTML

本文详细解析了HTML中onclick事件触发时如何获取event对象，通过一个简单的按钮点击示例，展示了如何使用window.event或arguments来捕捉事件，适用于前端开发者深入了解DOM事件处理。

onclick自带event事件，代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <button onclick="btnFunc()"></button>
    <script>
        function btnFunc()
        {
            var e = window.event || arguments.callee.caller.arguments[0];
            console.log(e);
        }
    </script>
</body>
</html>

JavaScript学习笔记（十五）Event事件（上）_js onclick event(1)
2401_84254087的博客
04-28 1056
console.log(e.X轴坐标点信息)console.log(e.Y轴坐标点信息)相对于浏览器窗口你点击的坐标点。相对于页面你点击的坐标点。点击按键信息（了解）
DOM事件对象
沉梦昂志
07-12 259
绑定事件的两种方式/DOM事件的级别 我们在之前的一篇文章《04-JavaScript/22-DOM简介和DOM操作》中已经讲过事件的概念。这里讲一下绑定（注册）事件的两种方式，我们以onclick事件为例。 DOM0的写法：onclick element.onclick = function () { } 举例： <body> <button>点我</button> <script> var btn = document.getE
Dom 中绑定onclick时间获取对象以及event的方法
qq_38761664的博客
07-04 9059
当Dom中绑定了click时间时，我们需要获取当前节点，可以在onclick事件中传值this来获取，例如： var oLi=$('') function Click(target){ var e=window.event || arguments.callee.caller.arguments[0]; e.preventDefault();         e.stopPropag
8.28 Event事件
最新发布
2503_92841156的博客
08-28 913
对于一些标签来说，他们拥有自己的事件，比如：a标签可以跳转，submit/button可以提交表单，reset可以重置按钮，那么如果想要给这些按钮添加事件，并且不让他执行对应的默认事件的话，就需要使用自制时间发生；补充一个知识点：点击a标签的时候，想要将默认的跳转去除掉，添加自己的跳转方式 对于a标签来说，默认的行为就是进行页面跳转，如果不想让a标签进行跳转，可以在注册事件中使用return false。Event 对象代表事件的状态，比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。
事件参数event
Mr_Wangkk的博客
02-23 518
<div><button>点我</button></div> var div = document.querySelector("body div") //每一个事件被触发时,都会向事件函数中传入一个参数, 这个参数是事件信息对象, 里边包含了事件目标,和坐标等信息 div.onclick = function(event){ // 获取事件类型 console.log(event.type) //click // 获取事件触发目标, 谁触发...
javaonclick传递event
germmy-神一样的开发
09-11 1345
  标签：js阻止事件冒泡   假设在html中有个onclick="showpopup()",在函数showpopup传一个名为event参数过去，   即是如下格式：onclick="showpopup(event)",那么在javascript的函数中可以接受到事件源。     见下述例子： function showpopup(event){    stopBubb...
JS 获取触发事件的对象
dianboliao0344的博客
01-20 440
event.srcElement：引发事件的目标对象，常用于onclick事件。 event.fromElement：引发事件的对象源，常用于onmouseout和onmouseover事件。 event.toElement：引发事件后，鼠标移动到的目标源，常用于onmouseout和onmouseover事件。 onmouseover时，srcElement相当于toEle...
Angular4.x Event (DOM事件和自定义事件详解)
10-17
自定义组件`EventBubblingComponent`中的按钮点击触发了DOM的click事件，然后这个事件冒泡到了外层的`AppComponent`，在`onClick()`方法中捕获并处理。 至于自定义事件，Angular使用@Output()装饰器和EventEmitter...
html的DOM中Event对象onblur事件用法实例
09-03
在JavaScript中，`onblur`事件还可以与其他DOM事件（如`onclick`、`onfocus`等）结合使用，以实现更复杂的交互逻辑。例如，当一个元素获得焦点后，可以使用`onfocus`事件来改变其样式，而当它失去焦点时，通过`...
Javascript Event事件中IE与标准DOM的比较
10-29
- DOM中，事件对象作为处理函数的第一个参数传递，例如`document.onclick = function(event) { ... }`。 4. **获取目标元素**： - IE使用`srcElement`属性来获取触发事件的元素，如`var oTarget = oEvent....
DOM（三）event事件
.
08-07 1975
交代一个例子<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>事件</title> <style type="text/css"> div {padding:40px;} #div1{background: red
Virtual-dom-event-binding-issue:尝试使虚拟 dom 事件绑定工作
07-01
在JavaScript的世界里，虚拟DOM（Virtual DOM）是前端开发中的一种优化技术，它极大地提高了Web应用的性能。虚拟DOM允许开发者在内存中构建一个抽象的DOM树，而不是直接操作真实的DOM，这使得更新UI变得更加高效。...
html元素的onclick事件传递参数即如何获取html标签的data
菜鸟的博客
01-15 3465
&lt;a aa="aa" data-bb="bb" onclick="test(event, this)"&gt;aaa&lt;/a&gt; &lt;script&gt; function test(event, elm) { alert(elm.getAttribute("aa")); alert(elm.getAttribute("data-bb"));
HTML通过事件传递参数到js 二 event
dh0536的博客
07-21 339
原文链接http://blog.sina.com.cn/s/blog_8a18c33d010172pp.html event用例： <!DOCTYPE html><html><head lang="en"> <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.js"...
点击事件：onclick、addEventListener、attachEvent及解绑事件
JEFF_xieyuzhi的博客
09-28 510
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> </style> </head> <body> <di...
HTML使用vue的 event,vue怎么传event参数
weixin_29133985的博客
06-24 952
大家好，今天给大家分享的是vue怎么传event参数，我们都知道在vue中执行函数的时候我们可以这样写我们只要在html标签上面加上v-on:click="liebiao"这个是我们点击这个btn的话会执行liebiao函数，当然这个是没有传递参数的，如果我们想要传递参数过去咋办呢？我们可以这样写v-on:click="liebiao('myname')"这样的话我们就传递了一个 myname ...
js鼠标事件
weixin_33947521的博客
06-23 239
属性 此事件发生在何时... IE F O W3C onabort 图像的加载被中断。 4 1 9 Yes onblur 元素失去焦点。 3 1 9 Yes onchange 域的内容被改变。 3 1 9 Yes onclick 当用户点击某个对象时调用的事...
html onclick传递多个参数,js onclick事件传参数的方法分析
weixin_31369469的博客
06-28 8067
本节内容：js中的onclick事件传参1、在页面中给方法传参数，有如下的两种方法：方法1，onclick=cancel(id，patientId);在js文件中定义cancel方法如果要把当前对象传过去用onclick="cancel(this,id,patientId)"js中cancel(obj，id，patientId)方法2，在js中用复制代码 代码示例:jquery$(function...
html对事件处理,html中事件处理中的this和event对象
weixin_35662051的博客
06-08 853
在用js编写页面事件处理代码时，会常常涉及到this和event对象，但有时在采用不一样的事件处理，尤为是在与自定义的对象关联时，这些对象的指向变的有些复杂。html本文来详细介绍下各类场景下 这些对象 真正指向。jquery1、事件直接写在html标签中函数一、案例1：测试测试this处理代码如编码function clickBtn(){alert(this.location.href);}sp...
HTML DOM Event 对象详解及事件处理
随着标准的发展，W3C定义了第二级DOM事件标准，引入了一些新的属性和方法，如： - `bubbles`：返回一个布尔值，表示事件是否会在DOM树中逐级向上冒泡。 - `cancelable`：表示事件是否可以被取消。 - `currentTarget...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值