Suppose I have some HTML with a data-* attribute:

<div data-my-attribute="something"></div>

Now, I have some JavaScript that wants to do something if that attribute exists. But that JavaScript also needs the value (if the attribute exists). So, I can do something like this:

var value = $('[data-my-attribute]').attr('data-my-attribute');
if (value) { do something }

Having the attribute name appear twice in this code just annoys me. I could do something silly like this to have only one place where the attribute name is declared, but the code is more verbose and less readable:

var attrName = "data-my-attribute";
var value = $(`[${attrName}]`).attr(attrName);
if (value) { do something }

Is there a better (simpler, doesn't involve specifying the attribute name twice) way to find and retrieve the value of an attribute in a chunk of HTML?