How to get tagname of the current selected element in jquery

Question

I use $('[attribute]') to select html nodes. When I am using the nodes it would be nice to know which html element was selected.

Pseudo code:

$('body').on('click', '[action]', function(){
    var htmlElementName = this.name;

    if(htmlElementName == 'form'){
        return;
    }

            //do stuff

});

score 6 · Accepted Answer · answered Dec 20 '13 at 12:33

6

Just get the value of a tagName property:

var htmlElementName = this.tagName;

REF: https://developer.mozilla.org/en-US/docs/Web/API/Element.tagName

answered Dec 20 '13 at 12:33

VisioN

143,310
32
282
281

score 3 · Answer 2 · answered Dec 20 '13 at 12:34

3

As per the title, in jQuery specifically

$(this).prop('tagName');

the native version seems simpler

this.tagName

note that case might vary, so using toLowerCase() is generally a good idea

answered Dec 20 '13 at 12:34

adeneo

312,895
29
395
388

According to the [**MDN**](https://developer.mozilla.org/en-US/docs/Web/API/Element.tagName#Example) the case varies only for HTML and XML: *"In XHTML (or any other XML format), "span" would be alerted. In HTML, "SPAN" would be alerted instead."*. So if the OP works with a proper HTML document the name in capitals should be returned. – VisioN Dec 20 '13 at 12:39
@VisioN - that's why it might vary, I always chain on a toLowerCase() to avoid issues, as I can never remember when it's lowercase and when it's uppercase. – adeneo Dec 20 '13 at 12:42
Interesting that you don't use `toUpperCase()` instead `;)` – VisioN Dec 20 '13 at 12:43
@VisioN - Actually, I've created my own custom `toCamelCase()` that I use `;)` – adeneo Dec 20 '13 at 12:48
BTW did you know that [jQuery has its own implementation](http://stackoverflow.com/a/14345461/1249581) of `toCamelCase`? – VisioN Dec 20 '13 at 13:06

score 2 · Answer 3 · answered Dec 20 '13 at 12:33

2

You can use this.tagName

$('body').on('click', '[action]', function(){
    var htmlElementName = this.name;
    var tagName = this.tagName;
    if(htmlElementName == 'form'){
        return;
    }       //do stuff    
});

answered Dec 20 '13 at 12:33

Adil

146,340
25
209
204

You see it was so simple that I could not find this. I tried tagname, name, elementname and nodename. Just forgot a capital! – botenvouwer Dec 20 '13 at 12:35
Yes, it happens sometimes, javascript is case sensitive thats why. – Adil Dec 20 '13 at 12:36

Mr.G · Answer 4 · 2013-12-20T12:50:33.753

0

Try this:

$('body').on('click', '[action]', function(e){

    var htmlElementName = $(this).prop("tagName");

});

edited Dec 20 '13 at 12:50

answered Dec 20 '13 at 12:42

Mr.G

3,413
2
16
20

How to get tagname of the current selected element in jquery

4 Answers4