CODEWITHSUNDEEP
javascriptjqueryhtml
Stephan Wagner
Stephan Wagner

Reputation: 990

How can I find out if an data- attribute is set to an empty value?

Is there a way to find out if an data- attribute is set to an empty value or if the value of it is not set at all?

See this fiddle example (Check the console when clicking on the elements):

http://jsfiddle.net/StephanWagner/yy8qvwfp/

<div onclick="console.log($(this).attr('data-test'))">undefined</div>

<div data-test="" onclick="console.log($(this).attr('data-test'))">empty</div>

<!-- this one will also return an empty value -->
<div data-test onclick="console.log($(this).attr('data-test'))">null</div>

<div data-test="value" onclick="console.log($(this).attr('data-test'))">value</div>

Im having the issue with the third example. I need to know if the attribute actually is set to an empty value or if it is not set at all. Is that actually possible?

EDIT: The reason I'm asking is that I'm updating content with the attributes value, so data-test="" should update the content to an empty value, but data-test should do nothing at all

Upvotes: 1

Views: 307

Answers (1)

Scimonster
Scimonster

Reputation: 33399

This is impossible. The two following elements are normalized to the same thing (the first).

<div data-test="" onclick="console.log($(this).attr('data-test'))">empty</div>

<!-- this one will also return an empty value -->
<div data-test onclick="console.log($(this).attr('data-test'))">null</div>

I tested this by checking the outerHTML of both elements. You're going to need to come up with a different way to achieve this.

Upvotes: 4

Related Questions