HTML 标签中onclick事件中的this

教程分享 > Java教程 (1766) 2023-03-28 11:29:14

HTML 标签中onclick事件中的this并非当前元素。而是window。需要获取当前的元素怎么办呢?以下开始讲解。

首先要标签这是这样的

<a href="#" onclick="on()">

<script>
function on(){
console.log(this);//
}
</script>
大家猜猜上方的this是<a>标签么?
--答案肯定不是的。
这里的this获取到的是window对象

如何才难通过元素的onclick事件绑定获取元素本身呢?

<a href="#" onclick="on(this)">

<script>
function on(obj){
console.log(obj);//
}
</script>
通过传递参数来获取。

原理

this关键字指定的永远是它的拥有者。onclick事件实际是window在操作,所以onclick的事件其实拥有者是window
https://www.leftso.com/article/598.html

相关文章
HTML 标签中onclick事件中的this并非当前元素。而是window。需要获取当前的元素怎么办呢?以下开始讲解。
前端状态数据展示小技巧
场景在使用 SpringBoot + Vue 进行前后端分离的开发过程中,部分功能是需要当用户登陆成功时后端(SpringBoot)向前端(Vue)返回一个to
企业软件_企业软件定制开发框架选择以及分类
问题描述:Cannot open URL. Please check this URL is correct: http://localhost:8080/解决办法​检查上方两个地方得端口是否一致
这里主要讲解下在前端开发中常用的调试日志对象console。console对象对目前国内流行的浏览器如:IE/谷歌/火狐的支持情况说明
Spring Boot 2.0 - 开发者工具devtools热部署教程(自动重载),如果你曾经在最新的UI开发框架上工作过,比如Node,angular,gulp等等,那么当你在某些代码发生变...
前言接上一篇《Vert.x 4 Web应用初识》,在web应用中除了访问地址得到动态的信息还有静态的资源库访问,如 jQuery / bootstrap 等前端
本文主要说明在spring mvc框架中如何接收前端发过来的集合对象和相关的处理。主要讲解两种方式,form表单提交方式和ajax提交的方式
已封装成为插件欢迎使用及反馈插件下载:(访问密码9987)bootstrap-viewer.zipbootstrap image viewer 图片放大查看实现效果:小图  大图  &lt;!D...
演示项目源码下载:(访问密码:9987)spring-cloud-config-server-git.zip微服务方法现在已经成为任何新 API 开发的行业标准,几乎所有组织都在推广它
本文主要翻译spring官方的基于spring security框架的oauth2开发指南,spring,oauth2,spring框架,Java编程
简介在主流公司的程序开发中,为了提高程序开发迭代的速度,基本都是前后端分离架构,而前端既包括网页、App、小程序等等,因此必须要有一个统一的规范用于约束前后端的
JDK11 90+ 新特性新功能(第二部分:非开发人员功能)
Vert.x java 入门,Vert.x这个框架在常规的web业务开发中估计还不是很成熟。但是了解了他的一些原理我觉得可以有一番作为。今天主要简单讲解下eclipse Vert.x是什么有什么...