Ich muss Elemente identifizieren, von denen Ereignisse ausgelöst werden.
Mit event.target
wird das jeweilige Element abgerufen.
Welche Eigenschaften kann ich von dort aus nutzen?
- href
- Ich würde
- Knotenname
Ich kann nicht viele Informationen dazu finden, auch nicht auf den jQuery- Seiten. Ich hoffe, dass jemand die obige Liste vervollständigen kann.
BEARBEITEN:
Diese können hilfreich sein: selfHTML-Knoteneigenschaften und selfHTML-HTML-Eigenschaften
quelle
Wenn Sie das
event.target
mit Firebug- oder Chrome-Entwicklertools untersuchen, sehen Sie, dass ein span-Element (z. B. die folgenden Eigenschaften) alle Eigenschaften eines Elements aufweist. Es kommt darauf an, was das Zielelement ist: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
quelle
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 }
Nutzen Sie die Verwendung von Filter-Eigenschaften
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()`
quelle
event.target
Gibt den Knoten zurück, auf den die Funktion abzielte. Dies bedeutet, dass Sie mit jedem anderen Knoten, von dem Sie ihn erhalten möchten, alles tun können, was Sie möchtendocument.getElementById
Ich habe es mit jQuery versucht
var _target = e.target; console.log(_target.attr('href'));
Geben Sie einen Fehler zurück:
Aber
_target.attributes.href.value
war Werke.quelle
e.target
es sich nicht um ein jQuery-Objekt handelt und.attr()
es sich um die Methode von jQuery handelt. Wenn Sie es versuchen__target.getAttribute('href');
würden, würde es gut funktionieren.event.target
Gibt den Knoten zurück, auf den die Funktion abzielte. Dies bedeutet, dass Sie alles tun können, was Sie mit einem anderen Knoten tun würden, wie dem, von dem Sie ihn erhalten würdendocument.getElementById
quelle
Eine einfache Möglichkeit, alle Eigenschaften eines bestimmten DOM-Knotens in Chrome anzuzeigen (ich bin in Version 69), besteht darin, mit der rechten Maustaste auf das Element zu klicken, "Inspizieren" auszuwählen und dann anstelle der Registerkarte "Stil" auf "Eigenschaften" zu klicken. .
Auf der Registerkarte Eigenschaften sehen Sie alle Eigenschaften für Ihr bestimmtes Element.
quelle
//Do it like--- function dragStart(this_,event) { var row=$(this_).attr('whatever'); event.dataTransfer.setData("Text", row); }
quelle