17. What is the use of data-* attributes in html?

data-* is used to store custom information on all HTML element.
data-* must contain only numbers, hypen (-), dot (.), colon (:) and underscore (_).
data-* cannot contain any capital letters.
data-* value can be any string.

Example:

<!-- Image -->
<img src="logo.png" data-desc="I am a Logo" />

<!-- List -->
<ul>
  <li data-type="veg" data-id="1">Paneer</li>
  <li data-type="non-veg" data-id="2">Chicken</li>
  <li data-type="non-veg" data-id="3">Mutton</li>
</ul>