Najlepszy sposób dodawania metadanych do elementów HTML

Usiłuję zebrać sposób oznaczania różnych komponentów w HTML, które są analizowane przez skrypt jQuery i tworzone podczas ładowania strony.

Na przykład w tej chwili mogę umieścić następujące informacje na mojej stronie ..

<a href="link.html" class="Theme-Button Theme-Button-Style-win2007 Theme-Button-iconLeft Theme-Button-AlignmentCenter Theme-Button-fullWidth">This is a button</a>

Po znalezieniu skryptu jQuery wstrzyknie html niezbędny do utworzenia przycisku z ikoną i wszystkimi niezbędnymi wydarzeniami itp.

Jest to jednak bałagan i wymaga wielu długich nazw klas. Wolałbym zrobić coś takiego ...

<a href="#" class="Theme-Button" data="{style: 'win2007', icon: 'left', align:'center', fullWidth: true}"></a>

Nie jest o wiele krótszy, ale moim zdaniem bardziej schludny i wymaga mniejszej analizy. Problem polega na tym, że przeprowadziłem trochę badań nad „expandos” i jestem pewien, że niektóre przeglądarki tego nie polubią i nie będą sprawdzane.

Ktoś ma jakieś lepsze sugestie?

questionAnswers(6)

yourAnswerToTheQuestion