SEND CUSTOM HTML ATTRIBUTE DATA INTO JQUERY

You may have a requirement that an element link needs to send additional data to JavaScript, beyond the typical id and class attribute selectors and standard element attributes. Such is the case if you have multiple objects, each registered to the same browser click event handler function, but additional “parameters” need to be passed into that handler function.

This can be done by specifying arbitrary data-* attributes in your HTML elements, which are user-defined attributes exempt from HTML5 validation checking. In the jQuery handler function that receives the event, you can retrieve the attribute’s value with $(this).attr('data-*').

Imagine a series of buttons that all run the same JavaScript function ...

Get HTML5: Your visual blueprint™ for designing rich web pages and applications now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.