Rumah >hujung hadapan web >tutorial js >Bagaimana untuk Mendapatkan ID Elemen daripada Pendengar Acara menggunakan jQuery dan JavaScript?

Bagaimana untuk Mendapatkan ID Elemen daripada Pendengar Acara menggunakan jQuery dan JavaScript?

DDD
DDDasal
2024-12-22 01:25:16432semak imbas

How to Get an Element's ID from Event Listeners using jQuery and JavaScript?

Mendapatkan ID Elemen dalam Pendengar Acara dengan jQuery dan JavaScript

Untuk mengendalikan interaksi acara dalam JavaScript dengan berkesan, mengenal pasti elemen yang bertanggungjawab untuk acara itu penting. Begini cara untuk mendapatkan ID elemen yang mencetuskan acara menggunakan JavaScript jQuery dan vanila.

Pendekatan jQuery

jQuery menyediakan kaedah yang cekap untuk mengakses elemen sasaran yang memecat acara. Dalam fungsi pendengar acara, parameter acara mengandungi beberapa atribut berguna. Satu sifat sedemikian ialah event.target, yang merujuk terus kepada elemen yang memulakan acara.

Untuk mendapatkan semula ID elemen, hanya gunakan sintaks berikut:

event.target.id

Contoh:

$(document).ready(function() {
  $("a").click(function(event) {
    alert(event.target.id);
  });
});

Vanila JavaScript Pendekatan

Sementara jQuery memudahkan proses, JavaScript vanila menawarkan cara lain untuk mengakses ID elemen pencetus. Elemen sasaran semasa sentiasa diluluskan sebagai hujah pertama pendengar acara dalam JavaScript vanila. Argumen ini boleh dinamakan sewenang-wenangnya, tetapi acara ialah konvensyen biasa.

Untuk mendapatkan ID elemen, gunakan perkara berikut sintaks:

event.target.id

Contoh:

document.addEventListener("click", function(event) {
  alert(event.target.id);
});

Nota:

Adalah penting untuk mempertimbangkan bahawa objek acara bukan objek jQuery dalam pendekatan JavaScript vanila. Untuk menggunakan fungsi jQuery pada elemen sasaran, bungkusnya dalam sintaks $():

$(event.target).append(" Clicked");

Atas ialah kandungan terperinci Bagaimana untuk Mendapatkan ID Elemen daripada Pendengar Acara menggunakan jQuery dan JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn