Skip to content

Access a Custom HTML Attribute Cross-Browser

by on June 2, 2011

For whatever reason, IE actually got something right.The following works in IE.

alert(this.custom_attribute)

NOT FIREFOX OR CHROME!

Firefox and Chrome require an extra (messy) step when accessing a custom attribute you want to use for javascript – or in my case, jQuery. Despite the fact that adding attributes is just extending the html and should in no way interfere with your page, there is no easy way to access it. And, supposedly, using custom attributes  invalidates xhtml compliance though in actuality your page will stay in xhtml mode.

This is a case where real-world implementation diverges from the nitpicky compliance ideal in favor of functionality.

How to access custom attributes in IE, Firefox, & Chrome

The following will work in all 3 browsers; Though I have not tried Safari.

alert(this.getAttribute(‘custom_attribute’));

 

Hope this helps!

Advertisements
Leave a Comment

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: