[Edit]

JavaScript - get HTML element name

1 contributors

2 contributions

0 discussions

3 points

Created by:

Gigadude

791

In this article, we would like to show you how to get HTML element's name using JavaScript.

Quick solution:

xxxxxxxxxx
 
var element = document.querySelector('#element');
​
var elementName = element.localName;

Where: localName returns name as lower case letters.

or:

xxxxxxxxxx
 
var element = document.querySelector('#element');
​
var elementName = element.nodeName;

Where: nodeName returns name as upper case letters.

or:

xxxxxxxxxx
 
var element = document.querySelector('#element');
​
var elementName = element.tagName;

Where: tagName returns name as upper case letters.

Practical examples

Edit

Example 1:

Edit

xxxxxxxxxx
 
<!doctype html>
<html>
<body>
  <div id="element">Example text...</div>
  <script>
​
    var element = document.querySelector('#element');
​
    console.log(element.localName);
​
  </script>
</body>
</html>

Auto running

Example 2:

Edit

xxxxxxxxxx
 
<!doctype html>
<html>
<body>
  <div id="element">Example text...</div>
  <script>
​
    var element = document.querySelector('#element');
​
    console.log(element.nodeName);
​
  </script>
</body>
</html>

Auto running

Example 3:

xxxxxxxxxx
 
<!doctype html>
<html>
<body>
  <div id="element">Example text...</div>
  <script>
​
    var element = document.querySelector('#element');
​
    console.log(element.tagName);
​
  </script>
</body>
</html>