jQuery check if element contains any attribute

Question

I can check if an element have a specific attribute with:

if ($('#A').attr('myattr') !== undefined) {
    // attribute exists
} else {
    // attribute does not exist
}

How can I check if an element have any attribute?

Thank you

@Naeem : I think it could be such a nice feature but since there are easy ways to solve this problem, I don't think they could add it. — Tarik, Feb 14 '10 at 00:19

score 9 · Answer 1 · answered Feb 10 '10 at 20:24

9

If you want to see if the element has a particular attribute, just do this:

if ($('#something').is('[attribute]')) {
  // ...
}

answered Feb 10 '10 at 20:24

Pointy

405,095
59
585
614

1

I am interested to see if an element have any attribute at all not a specific one. – Mircea Feb 10 '10 at 20:26
OK, but the point is that what you typed in your example above won't work. – Pointy Feb 10 '10 at 20:27
This can work easily with multiple attributes too, just comma seperate the attribute selector in the 'is' method: ".is('[attribute], [attr2], [att3]')" – Graham Aug 03 '12 at 13:20

Jeff Sternal · Accepted Answer · 2010-02-11T00:46:32.173

6

Here's a function that determines whether any of the elements matching a selector have at least one attribute:

function hasOneOrMoreAttributes(selector) {
    var hasAttribute = false;
    $(selector).each(function(index, element) {
        if (element.attributes.length > 0) {
            hasAttribute = true;
            return false; // breaks out of the each once we find an attribute
        }
    });
    return hasAttribute;
}

Usage:

if (hasOneOrMoreAttributes('.someClass')) {
    // Do something
}

If you want to operate on selected elements that have at least one attribute, it's even easier - you create a custom filter:

// Works on the latest versions of Firefox, IE, Safari, and Chrome
// But not IE 6 (for reasons I don't understand)
jQuery.expr[':'].hasAttributes = function(elem) {
    return elem.attributes.length;
};

Which you can use like this:

$(document).ready(function(){
    $('li:hasAttributes').addClass('superImportant');
}

edited Feb 11 '10 at 00:46

answered Feb 10 '10 at 21:00

Jeff Sternal

47,787
8
93
120

Isn't it a bit too much : `$("some").get(0).attributes > 0` would be enough I think. – Tarik Feb 10 '10 at 21:20
@Tarik - that only checks the first matched element, when there may be multiple matches. – Jeff Sternal Feb 10 '10 at 21:22
@Jeff - Is there any way to add a class on the elements that have attributes with this function? Thanx again – Mircea Feb 10 '10 at 21:39
@Mircea - I updated my answer to show how you might do this, though it's buggy in IE 6 for reasons I can't figure out right now. – Jeff Sternal Feb 10 '10 at 22:34
But wasn't he asking "How can I check if an element have any attribute?". So I think it should be fine :) So if an element has more than 0 attribute, then it has at least one attribute. – Tarik Feb 11 '10 at 09:07
@Tarik - sorry, I wasn't very clear the first time. You're right that the question asked "How can I check if an element have any attribute?" but jQuery doesn't guarantee that it will return a single element - it's always possible that it will match zero or multiple elements, so the safest thing to do is check all of them (or none of them, since element zero may not exist). – Jeff Sternal Feb 11 '10 at 21:29

score 4 · Answer 3 · answered Aug 07 '12 at 03:33

4

$("selector").get(0).hasAttributes("attributes");

answered Aug 07 '12 at 03:33

Neo Zhou

61
6

score 2 · Answer 4 · edited May 23 '17 at 12:18

2

You'd need to use information from Get all Attributes from a HTML element with Javascript/jQuery

edited May 23 '17 at 12:18

Community

1
1

answered Feb 10 '10 at 20:26

cherouvim

31,725
15
104
153

score 2 · Answer 5 · answered Feb 10 '10 at 20:39

2

Not a whole jQuery code but it will work

$("a").click(
function () {
    if($("a").get(0).attributes > 0)
        alert("it has attributes");
})

answered Feb 10 '10 at 20:39

Tarik

79,711
83
236
349

Thanx Tarik, I am looking into this – Mircea Feb 10 '10 at 21:11

score 1 · Answer 6 · answered Feb 13 '12 at 23:47

I'm not sure if you're wanting to just return the elements that contain the attribute, but if you are, I've found the easiest method to be:

$('selector[attribute]')

That will return the jquery object to include all elements that contain the attribute regardless of its value. For example.

$(':text[maxlength]').addClass('has_max_length');

This would give all text inputs with the maxlength attribute a class of 'has_max_length'.

score 0 · Answer 7 · answered Dec 13 '11 at 19:24

Here's a solution that I found to be more reliable to know if an element has defined attributes that works in IE, Chrome and Firefox:

$(selector).each(function(index, element) {
    if (element.hasAttributes) { // Some browser supports this method
        if (element.hasAttributes()) {
            return true;
        }
     } else {
           // IE counts many attributes - even if not set explicitly
           var attrs = element.attributes;
           for (var i = 0; i < attrs.length; i++) {
                if (attrs[i].specified) {
                    return true;
                }
            }
     }
     return false;
});

The problem is that IE returns high attributes count even when none is set explicitly. For example, for a simple < p > tag, IE was telling me it had 111 attributes. With that solution, I was able to filter out those attributes that I wasn't interested in.

This solution was taken here: http://help.dottoro.com/ljevmnkf.php (just copied it in case the page is removed!)

jQuery check if element contains any attribute

7 Answers7

Linked