title: event.target.toString() or event.target.nodeName to check type of element
body: <p>I am building an eventlistener with delegation (like jQuery $("body").on("click", "button")). For that i have following event listener:
  <code>document.body.addEventListener("click", function(e) {})</code></p>
  
  <p>Now i wonder, which way is the best way to check for the type of the clicked element. Is it checking for it nodeName:</p>
  
  <p><code>if (e.target.nodeName.toLowerCase() !== "button") { return; }</code></p>
  
  <p>or would that solution be better:</p>
  
  <p><code>if (e.target.toString() !== document.createElement("button").toString()) { return; }
  </code>
  ?</p>
  
  <p>I think, the first solution could be perform better, but the second one could be more secure? And please think of document.create... as an variable outside the click event, for performance reason.</p>
  
  <p><strong>Answer</strong>
  Thanks to zippy dippy (how do i link accounts?) for his answer and introducing <code>e.target.matches("button")</code> as alternative. As already thought the check for the nodeName is still the best answer. But i like to try new things and that how my question rose up.</p>
  
  <p>I did a little check on Element.matches because i haven´t heard of it until now. For a pure type check (like in my question) the nodeName check is still the fastes way, except for Firefox. At least if i take <a href="http://jsben.ch/RL5PN" rel="nofollow noreferrer">http://jsben.ch/RL5PN</a> as valid benchmark. In Chrome Element.matches took almost double as long as nodeName. In Safari both of them are on equal ground, in Firefox Element.matches the fastest. But for more complexes case like <code>button.someClass[data-foo=someValue]</code> nothing beats Element.matches of course! </p>