Quali proprietà posso utilizzare con event.target?

Devo identificare gli elementi da cui vengono generati gli eventi.

Usando event.targetottiene il rispettivo elemento.

Quali proprietà posso utilizzare da lì?

• href
• id
• nodeName

Non riesco a trovare molte informazioni su di esso, nemmeno sulle pagine di jQuery , quindi spero che qualcuno possa completare l'elenco sopra.

MODIFICARE:

Possono essere utili: proprietà del nodo selfHTML e proprietà HTML selfHTML

event.targetrestituisce l'elemento DOM, quindi puoi recuperare qualsiasi proprietà / attributo che abbia un valore; quindi, per rispondere in modo più specifico alla tua domanda, sarai sempre in grado di recuperare nodeName, e potrai recuperare hrefe id, purché l'elemento abbia un hrefe iddefinito; altrimenti undefinedverrà restituito.

Tuttavia, all'interno di un gestore di eventi, puoi usare this, che è impostato anche sull'elemento DOM; molto più facile.

$('foo').bind('click', function () {
    // inside here, `this` will refer to the foo that was clicked
});

Se dovessi ispezionare event.targetcon firebug o gli strumenti di sviluppo di chrome, vedresti un elemento span (ad esempio le seguenti proprietà) avrà tutte le proprietà di qualsiasi elemento. Dipende da quale sia l'elemento di destinazione:

event.target: HTMLSpanElement

attributes: NamedNodeMap
baseURI: "file:///C:/Test.html"
childElementCount: 0
childNodes: NodeList[1]
children: HTMLCollection[0]
classList: DOMTokenList
className: ""
clientHeight: 36
clientLeft: 1
clientTop: 1
clientWidth: 1443
contentEditable: "inherit"
dataset: DOMStringMap
dir: ""
draggable: false
firstChild: Text
firstElementChild: null
hidden: false
id: ""
innerHTML: "click"
innerText: "click"
isContentEditable: false
lang: ""
lastChild: Text
lastElementChild: null
localName: "span"
namespaceURI: "http://www.w3.org/1999/xhtml"
nextElementSibling: null
nextSibling: null
nodeName: "SPAN"
nodeType: 1
nodeValue: null
offsetHeight: 38
offsetLeft: 26
offsetParent: HTMLBodyElement
offsetTop: 62
offsetWidth: 1445
onabort: null
onbeforecopy: null
onbeforecut: null
onbeforepaste: null
onblur: null
onchange: null
onclick: null
oncontextmenu: null
oncopy: null
oncut: null
ondblclick: null
ondrag: null
ondragend: null
ondragenter: null
ondragleave: null
ondragover: null
ondragstart: null
ondrop: null
onerror: null
onfocus: null
oninput: null
oninvalid: null
onkeydown: null
onkeypress: null
onkeyup: null
onload: null
onmousedown: null
onmousemove: null
onmouseout: null
onmouseover: null
onmouseup: null
onmousewheel: null
onpaste: null
onreset: null
onscroll: null
onsearch: null
onselect: null
onselectstart: null
onsubmit: null
onwebkitfullscreenchange: null
outerHTML: "<span>click</span>"
outerText: "click"
ownerDocument: HTMLDocument
parentElement: HTMLElement
parentNode: HTMLElement
prefix: null
previousElementSibling: null
previousSibling: null
scrollHeight: 36
scrollLeft: 0
scrollTop: 0
scrollWidth: 1443
spellcheck: true
style: CSSStyleDeclaration
tabIndex: -1
tagName: "SPAN"
textContent: "click"
title: ""
webkitdropzone: ""
__proto__: HTMLSpanElement

window.onclick = e => {
    console.dir(e.target);  // use this in chrome
    console.log(e.target);  // use this in firefox - click on tag name to view 
}  

trarre vantaggio dall'utilizzo delle proprietà del filtro

e.target.tagName
e.target.className
e.target.style.height  // its not the value applied from the css style sheet, to get that values use `getComputedStyle()`

event.targetrestituisce il nodo targetizzato dalla funzione. Ciò significa che puoi fare tutto ciò che desideri con qualsiasi altro nodo come quello da cui otterraidocument.getElementById

Ho provato con jQuery

var _target = e.target;
console.log(_target.attr('href'));

Restituisci un errore:

.attr non funziona

Ma è _target.attributes.href.valuestato funziona.

event.targetrestituisce il nodo targetizzato dalla funzione. Ciò significa che puoi fare tutto ciò che faresti con qualsiasi altro nodo come quello da cui otterraidocument.getElementById

Un modo semplice per vedere tutte le proprietà su un particolare nodo DOM in Chrome (sono sulla v.69) è fare clic con il pulsante destro del mouse sull'elemento, selezionare ispeziona, quindi invece di visualizzare la scheda "Stile" fare clic su "Proprietà" .

All'interno della scheda Proprietà vedrai tutte le proprietà per il tuo particolare elemento.

//Do it like---
function dragStart(this_,event) {
    var row=$(this_).attr('whatever');
    event.dataTransfer.setData("Text", row);
}