HTML 엘리먼트에 커스텀 attribute로 data-로 시작하는 이름을 지정하면, dataset으로 가져올 수 있다.
예를 들어 다음과 같은 html이 있을 때,
<!DOCTYPE html>
<html lang="ko">
...
<body>
<div
data-name="ori"
data-age="30"
data-super-long="superduperlong"
id="duck"
>
div입니다
</div>
<script src="index.js"></script>
</body>
</html>js에서 이렇게 가져올 수 있음
const $duck = document.querySelector("#duck");
const { name, age, superLong } = $duck.dataset;
console.log(superLong); //superduperlong