如何将其转换为数据属性？

Question

I'm confused with data-attributes and my task is to convert this into a html5 valid code:

<xy:search campaign="campaign-name" width="280px" height="32px">
</xy:search> 

This is an advertisement and recently we wanted to validate our page but this is the last error I couldn't fix, because of the custom dtd element.

I don't want to write custom dtd file, and yes, this code must be work exactly like before changes, they have a script for this custom element, so I just want to modify the base code and "translate" it to the validator, so the element must be visible/readable somehow for the advertisor's script.

I think it can be solved with html5 data-attributes, but I don't know that method...

Any help would be appriciated.

Answer 1

Assuming campaign it the only attribute you need to convert... it is as simple as prepending data- to the attribute. That's all a data attribute is. Example:

<xy:search data-campaign="campaign-name" width="280px" height="32px">

And then to access the value in something like jQuery, you would use .data() :

$("your element").data("campaign"); // getter
$("your element").data("campaign","new value"); // setter