data-* in HTML5

Example：
<article id="tu" data-category="Demo1" data-author="1"> ... </article>

1. In JavaScript
：getAttribute() and dataset。
  getAttribute
    document.getElementById('tu').getAttribute('data-category');
  setAttribute
    document.getElementById('tu').setAttribute ( 'data-author' , '2' ) ;
    var a = document.getElementById('tu');
    a.dataset.category = "xxx";
    a.setAttribute("data-category", "xxx");

   dataset
     var article = document.getElementById('tu');
     var data = article.dataset;
     alert(data.category);
     alert(data.author); //1

2. jQuery
  $("#tu").data('category');
  $("#tu").data("category", "Uncategorized");

3. CSS
 attr
   article::before {
      content: attr(data-category);
   }

 article[data-author='1'] {
    border-width: 1px;
 }