2015-08-06 35 views
45

Tôi đã đoạn mã sau:Sự khác biệt giữa Event.target, Event.toElement và Event.srcElement là gì?

document.oncontextmenu = function(evt) { 
    evt = evt || window.event; 
    console.log(evt.target, evt.toElement, evt.srcElement); 
}; 

Bằng cách nhấp vào nút chuột phải vào một <div class="foo"></div>, trả về này:

div.foo, div.foo, div.foo

Bằng cách nhấp vào nút chuột phải trên <input>, trả lại giá trị này:

đầu vào, đầu vào, đầu vào

Tất cả dường như mang lại kết quả tương tự. Có tình huống nào mà một trong số họ sử dụng khác với những người khác không?

Trả lời

39

Các event target là yếu tố mà sự kiện này là phái:

Đối tượng mà một event được nhắm mục tiêu bằng cách sử dụng DOM event flow. Mục tiêu sự kiện là giá trị của thuộc tính Event.target .

srcElement là cách không chuẩn IE để có được target.

Các current event target là yếu tố trong đó có người nghe sự kiện mà hiện nay được gọi:

Trong một dòng chảy sự kiện, mục tiêu sự kiện hiện nay là đối tượng liên quan đến với event handler hiện đang được gửi đi. Đối tượng này có thể là chính event target hoặc một trong những tổ tiên của nó. Mục tiêu sự kiện hiện tại thay đổi khi event tuyên truyền từ đối tượng để phản đối qua phases khác nhau của luồng sự kiện. Mục tiêu sự kiện hiện tại là giá trị của thuộc tính Event.currentTarget.

Sử dụng this bên trong một người biết lắng nghe sự kiện là một cách phổ biến (và tiêu chuẩn) để có được những mục tiêu sự kiện hiện tại.

Một số sự kiện loại có một relatedTarget:

Được sử dụng để xác định một thứ EventTarget liên quan đến một sự kiện UI, tùy thuộc vào loại sự kiện.

fromElementtoElement là các cách không chuẩn của IE để có được relatedTarget.

+4

Tôi đang sử dụng "toElement" trong Chrome phiên bản 60 - bạn có chắc đó là "cách thức không chuẩn của IE" không? – PandaWood

+0

MSDN nói rằng đó là "không chuẩn" và "không sử dụng nó trên các trang web sản xuất phải đối mặt với web": https://developer.mozilla.org/en-US/docs/Web/API/Event/srcElement – TetraDev

Các vấn đề liên quan