Мне нужно определить элементы, из которых запускаются события.
Использование event.target
получает соответствующий элемент.
Какие свойства я могу использовать оттуда?
- href
- мне бы
- nodeName
Я не могу найти по нему много информации, даже на страницах jQuery , так что надеюсь, что кто-то сможет заполнить приведенный выше список.
РЕДАКТИРОВАТЬ:
Они могут быть полезны: свойства узла selfHTML и свойства selfHTML HTML
источник
Если бы вы
event.target
проверили его с помощью инструментов разработчика firebug или chrome, вы бы увидели элемент span (например, следующие свойства), он будет иметь те свойства, которые есть у любого элемента. Это зависит от целевого элемента: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 }
воспользоваться преимуществами фильтров
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.target
возвращает узел, на который нацелена функция. Это означает, что вы можете делать все, что хотите, с любым другим узлом, например, с тем, который вы получили бы отdocument.getElementById
Я пробовал с jQuery
var _target = e.target; console.log(_target.attr('href'));
Вернуть ошибку:
Но
_target.attributes.href.value
было работает.источник
e.target
это не объект.attr()
jQuery, а метод jQuery. Если бы вы попробовали,__target.getAttribute('href');
это сработало бы нормально.event.target
возвращает узел, на который нацелена функция. Это означает, что вы можете делать все, что вы бы сделали с любым другим узлом, например, с тем, который вы получили бы отdocument.getElementById
источник
Простой способ увидеть все свойства конкретного узла DOM в Chrome (я использую v.69) - это щелкнуть элемент правой кнопкой мыши, выбрать «Проверить», а затем вместо просмотра вкладки «Стиль» нажать «Свойства» .
Внутри вкладки «Свойства» вы увидите все свойства конкретного элемента.
источник
//Do it like--- function dragStart(this_,event) { var row=$(this_).attr('whatever'); event.dataTransfer.setData("Text", row); }
источник