After reading the detailed specifications of HTML5, you will find that the usage of this custom data attribute is very simple. That is, you can add any attribute starting with "data-" to the HTML tag. These attributes will not be displayed on the page. , it will not affect your page layout and style, but it is readable and writable.
This method is already built into jquery. Data can be obtained through $('#content').data('list');. This method appeared after jQuery version 1.4.3, and it can return the corresponding data attribute. .
Usage of jquery to operate HTML5 data-*
http://code.jquery.com/jquery-2.1.0.min.js">>
<script><br>
$(function(){<br>
//Read the value of data-*<br>
$("li").each(function(v) {<br>
console.log($(this).data('name'));<br>
});<br>
<br>
//Set the value of data-*<br>
$("li").eq(0).data('name','bryant');<br>
$("li").each(function(v) {<br>
console.log($(this).data('name'));<br>
});<br>
<br>
//Delete the value of data-* The removeAttr is used here, and the official removeData test does not work<br>
$("li").eq(0).removeAttr('data-name');<br>
$("li").each(function(v) {<br>
console.log($(this).data('name'));<br>
});<br>
})<br>
</script>