In my code, I want to pass a unique ID to the li by using a class. However, whenever I refresh the page, the "data-id" attribute is always changing. So the ID becomes different every time the page is reloaded.
Is there a way to make it static but not setting a preset ID?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div>
<ul>
<li id="item">ID check</li>
</ul>
</div>
<script>
class IdChecker {
constructor() {
this.id = Math.round(Math.random() * 10000);
}
}
let item = document.getElementById('item');
item.setAttribute('data-id', String(new IdChecker().id))
</script>
</body>
</html>