Risheekant Vishwakarma
Risheekant Vishwakarma

Reputation: 1046

what is data-key in <li> tag in html

I have got an example like this.

lis += '<li data-key="' + list[i].key + '">' + list[i].name + ' [' + genLinks(list[i].key, list[i].name) + ']</li>';

But I want to know about the data-key and how to use it.

Upvotes: 2

Views: 2750

Answers (2)

RAHUL S R
RAHUL S R

Reputation: 1579

usually when you want to store some more info about that element you can use data-key attribute i.e

<ul><li id="1" data-sub="Mathematics">Trigonometry</li>
    <li id="2" data-sub="Literature">The Tempest</li></ul> 

now you can fetch these values whenever you want like in jq

$(function){
alert($('#2').text() +"is a Classic" + $('#2').data("sub") )
})

Upvotes: 3

Sander Meijer
Sander Meijer

Reputation: 85

Data attribute is used to store data in your element, this can be anything you want. You can retrieve it with javascript by using .dataset:

<li id="example" data-example="test123"> </li>

var element = document.getElementById('example');

element.dataset.example // "test123"

Hope this helped you,

Upvotes: 2

Related Questions