Как использовать значение data атрибута в JS скрипте?

Question

Как сделать на js так чтобы при клике на span с классом timestamp, в currentTime устанавливалось то количество секунд, которое указано в атрибуте data-timestamp?

const elements = document.querySelectorAll(".timestamp");
elements.forEach(element => {
        element.addEventListener("click", () => { 
            document.getElementsByTagName('video')[0].currentTime = 5;
        });
    }
);

<span class="timestamp" data-timestamp="10">00:00:10</span>
<span class="timestamp" data-timestamp="20">00:00:20</span>
<span class="timestamp" data-timestamp="30">00:00:30</span>

Answer 1

В js доступ к атрибутам осуществляется через объект dataset:

const elements = document.querySelectorAll(".timestamp");
elements.forEach(element => {
  element.addEventListener("click", () => {
    let timestamp = element.dataset.timestamp;
    document.getElementsByTagName('video')[0].currentTime = timestamp;

  });
});

<span class="timestamp" data-timestamp="10">00:00:10</span>
<span class="timestamp" data-timestamp="20">00:00:20</span>
<span class="timestamp" data-timestamp="30">00:00:30</span>

БЛОГ НА HUSL

Как использовать значение data атрибута в JS скрипте?

Ответы (1 шт):