What properties can I use with event target

Question

I need to identify elements from which events are fired    Using event target gets the respective element   What properties can I use from there    href   id    nodeName   I cannot find a whole lot of info on it  even on the jQuery pages  so here is to hoping someone can complete the above list   EDIT   These may be helpful  selfHTML node properties and selfHTML HTML properties

User · Answer

event target returns the node that was targeted by the function  This means you can do anything you want to do with any other node like one you d get from document getElementById  I m tried with jQuery  var  target   e target  console log  target attr  href       Return an error         attr not function   But  target attributes href value was works

User · Answer

window onclick   e   gt        console dir e target       use this in chrome     console log e target       use this in firefox - click on tag name to view          take advantage of using filter propeties    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

User · Answer

An easy way to see all the properties on a particular DOM node in Chrome  I m on v 69  is to right click on the element  select inspect  and then instead of viewing the  Style  tab click on  Properties     Inside of the Properties tab you will see all the properties for your particular element

User · Answer

If you were to inspect the event target with firebug or chrome s developer tools you would see for a span element  e g  the following properties  it will have whatever properties any element has  It depends what the target element 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    lt span gt click lt  span gt   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

User · Answer

event target returns the node that was targeted by the function  This means you can do anything you would do with any other node like one you d get from document getElementById

User · Answer

event target returns the DOM element  so you can retrieve any property  attribute that has a value  so  to answer your question more specifically  you will always be able to retrieve nodeName  and you can retrieve href and id  provided the element has a href and id defined  otherwise undefined will be returned   However  inside an event handler  you can use this  which is set to the DOM element as well  much easier      foo   bind  click   function             inside here   this  will refer to the foo that was clicked

User · Answer

Do it like--- function dragStart this  event        var row   this   attr  whatever        event dataTransfer setData  quot Text quot   row

[events] What properties can I use with event.target?

Examples related to events

Examples related to properties

Examples related to jquery