在前端开发中,我们常常需要通过 jQuery 操作 DOM。而在使用 jQuery 时,$(this) 是一个非常常用的选择器。但是,有时我们也需要获取 $(this) 元素的 ID 值,来进行相应的操作。那么,如何获取 jQuery $(this) 的 ID 呢?
获取 ID 的两种方式
1. 使用 attr()
使用 attr()
函数可以获取 HTML 元素的属性值。因此,我们可以通过以下代码来获取 $(this) 元素的 ID:
var id = $(this).attr('id');
这里的 attr('id')
表示获取元素的 id
属性值。
2. 直接使用 this.id
除了使用 attr()
函数,还可以直接使用 JavaScript 中的 this.id
来获取元素的 ID,如下所示:
var id = this.id;
这种方式更为简单,不过需要注意的是,只有在事件处理函数内部才能使用 this.id
,否则会返回 undefined。
示例代码
下面给出一个例子,演示如何在点击按钮时获取该按钮的 ID:
-- -------------------- ---- ------- --------- ----- ------ ------ ----- ---------------- --------------------- ------- ----------------------------------------------------------- ------- ------ ------- ---------------------- ------- ---------------------- ------- ---------------------- -------- ---------------------------- - --- -- - ------------------- ---------------- --- --------- ------- -------
在这个例子中,我们给三个按钮都绑定了一个点击事件处理函数,该函数会获取点击的按钮的 ID,并将其输出到控制台。当我们在浏览器中运行这个代码时,点击任意一个按钮后,在控制台中就可以看到相应的 ID 值了。
总结
通过本文的介绍,我们学习了两种方式来获取 jQuery $(this) 元素的 ID。这些知识点对于前端开发人员来说是非常基础的内容,但是它们是不可或缺的。因此,熟练掌握这些技巧,能够帮助我们更好地完成页面开发任务。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/30514