Question

这仅适用于第一个元素。我如何让它适用于所有这些？坚持使用香草javascript。

var timeElement = document.querySelector('.datepublished > time'),
time = new Date(timeElement.getAttribute('datetime'));

timeElement.innerText = TimeAgo.inWords(time.getTime());

<div class="datepublished"><time datetime="2017-07-04">date</time></div>
<div class="datepublished"><time datetime="2017-08-04">date</time></div>
<div class="datepublished"><time datetime="2017-09-04">date</time></div>

Answer 1

您可以按照以下方式执行此操作：

var func = function(el) {
  // TimeAgo removed for compatibility
  el.innerText = new Date(el.getAttribute('datetime')).getTime();
}

// Variant 1 //

var dates = document.getElementsByClassName('datepublished');

for (var node of dates) {
  func(node.getElementsByTagName('time')[0]);
}

// Variant 2 //

var dates = document.querySelectorAll('.datepublished > time');

for (var node of dates) {
  func(node);
}

<div class="datepublished">
  <time datetime="2017-07-04">date</time>
</div>
<div class="datepublished">
  <time datetime="2017-08-04">date</time>
</div>
<div class="datepublished">
  <time datetime="2017-09-04">date</time>
</div>

Answer 2

如果您想使用选择器获取所有元素，则必须使用

document.querySelectorAll ("yourSelector")

有关详细信息，请查看以下内容：https://www.w3schools.com/jsref/met_document_queryselectorall.asp

如何在一个页面上的多个元素上运行此功能？

2 个答案: