Welke eigenschappen kan ik gebruiken met event.target?

Ik moet elementen identificeren waaruit gebeurtenissen worden geactiveerd.

Met event.targetwordt het betreffende element opgehaald.

Welke eigenschappen kan ik vanaf daar gebruiken?

• href
• id
• nodeName

Ik kan er niet veel informatie over vinden, zelfs niet op de jQuery-pagina’s, dus hier is te hopen dat iemand de bovenstaande lijst kan voltooien.

BEWERKEN:

Deze kunnen nuttig zijn: selfHTML-knooppunteigenschappenen selfHTML HTML-eigenschappen

Antwoord 1, autoriteit 100%

event.targetretourneert het DOM-element, zodat u elke eigenschap/attribuut met een waarde kunt ophalen; dus om uw vraag specifieker te beantwoorden, u kunt altijd nodeNameophalen en u kunt hrefen idophalen, op voorwaarde dat het element heefteen hrefen idgedefinieerd; anders wordt undefinedgeretourneerd.

In een event handler kun je echter thisgebruiken, dat ook is ingesteld op het DOM-element; veel gemakkelijker.

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

Antwoord 2, autoriteit 95%

Als je de event.targetzou inspecteren met firebug of de ontwikkelaarstools van chrome, zou je zien dat een span-element (bijvoorbeeld de volgende eigenschappen) alle eigenschappen heeft die elk element heeft. Het hangt ervan af wat het doelelement is:

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

Antwoord 3, autoriteit 55%

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 
}  

profiteer van het gebruik van filtereigenschappen

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()`

Antwoord 4, autoriteit 16%

event.targetretourneert het knooppunt waarop de functie het doelwit was. Dit betekent dat je alles kunt doen wat je wilt doen met elk ander knooppunt, zoals je zou krijgen van document.getElementById

Ik ben uitgeprobeerd met jQuery

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

Fout teruggeven:

.attr werkt niet

Maar _target.attributes.href.valuewerkte.

Antwoord 5, autoriteit 9%

event.targetretourneert het knooppunt dat door de functie werd getarget. Dit betekent dat je alles kunt doen wat je zou doen met elk ander knooppunt, zoals je zou krijgen van document.getElementById

Antwoord 6, autoriteit 2%

Een gemakkelijke manier om alle eigenschappen op een bepaald DOM-knooppunt in Chrome te zien (ik gebruik v.69) is door met de rechtermuisknop op het element te klikken, inspecteren te selecteren en vervolgens in plaats van het tabblad ‘Stijl’ te bekijken op “Eigendommen”.

Binnen het tabblad Eigenschappen ziet u alle eigenschappen voor uw specifieke element.

Antwoord 7

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