Can you define your own attributes for an HTML element?

Question

I was wondering if you can define your own attributes in HTML. For example, in an HTML div there is a range of attributes such as style , title , class , etc. Can you compose and add your own while remaining syntactically correct?

For example: <div class="example" test_item="20"></div>

The need for this is related to Javascript and data.

Answer 1

With one exception, no. HTML uses attributes and elements defined by the specification, and only those attributes and elements.

This exception is attributes with names starting with data- and only when you are executing an HTML 5 draft.

However, it is often advisable to encode data in the id or class attributes.

Answer 2

You can define a data attribute for any element as follows and use the jQuery data method to easily retrieve these attributes.

 <div class="example" data-mydata="mydata")></div> //In jquery to retrieve mydata you have to just say $(".example").data("mydata"); 

Answer 3

Syntactically correct - NO; however jQuery will read any attributes added to the HTML tag without any problems.

Answer 4

for the record, you can add any attribute you want to add to the element with javascript using setAttribute ("name", "value")

 document.body.setAttribute("name","value"); 

and it works great. It is also basically a cross browser: quirksmode