如何获取 jQuery $(this) 的 ID?

阅读时长 2 分钟读完

在前端开发中,我们常常需要通过 jQuery 操作 DOM。而在使用 jQuery 时,$(this) 是一个非常常用的选择器。但是,有时我们也需要获取 $(this) 元素的 ID 值,来进行相应的操作。那么,如何获取 jQuery $(this) 的 ID 呢?

获取 ID 的两种方式

1. 使用 attr()

使用 attr() 函数可以获取 HTML 元素的属性值。因此,我们可以通过以下代码来获取 $(this) 元素的 ID:

这里的 attr('id') 表示获取元素的 id 属性值。

2. 直接使用 this.id

除了使用 attr() 函数,还可以直接使用 JavaScript 中的 this.id 来获取元素的 ID,如下所示:

这种方式更为简单,不过需要注意的是,只有在事件处理函数内部才能使用 this.id,否则会返回 undefined。

示例代码

下面给出一个例子,演示如何在点击按钮时获取该按钮的 ID:

-- -------------------- ---- -------
--------- -----
------
------
    ----- ----------------
    ---------------------
    ------- -----------------------------------------------------------
-------
------
    ------- ----------------------
    ------- ----------------------
    ------- ----------------------
    --------
        ---------------------------- -
            --- -- - -------------------
            ----------------
        ---
    ---------
-------
-------

在这个例子中,我们给三个按钮都绑定了一个点击事件处理函数,该函数会获取点击的按钮的 ID,并将其输出到控制台。当我们在浏览器中运行这个代码时,点击任意一个按钮后,在控制台中就可以看到相应的 ID 值了。

总结

通过本文的介绍,我们学习了两种方式来获取 jQuery $(this) 元素的 ID。这些知识点对于前端开发人员来说是非常基础的内容,但是它们是不可或缺的。因此,熟练掌握这些技巧,能够帮助我们更好地完成页面开发任务。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/30514

纠错
反馈