时间戳

首页 > 解决方案 > 如何在具有相同类名的每个 div 中显示当前日期元素？

javascript - 如何在具有相同类名的每个 div 中显示当前日期元素？

问题描述

我想在每个具有相同类名的 div 中显示当前日期元素。

我的代码在下面，但它只显示一次。

你能帮忙吗？

提前致谢。

var today = new Date();
var dd = String(today.getDate()).padStart(2, '0');
var mm = String(today.getMonth() + 1).padStart(2, '0'); //January is 0!
var yyyy = today.getFullYear();
today = 'Updated ' + mm + '/' + dd + '/' + yyyy;
var span = document.createElement('span');
span.className = 'updated';

span.textContent = today;
document.querySelector( ".current-date" ).prepend(span);
.updated {
  display: inline-block;
  color: black;
  font-weight: bold;
  background: coral;
  padding: 4px 10px;
}
<section id="First" class="current-date">
  <h1>Hello First</h1>
  <div>Lorem ipsum dolor sit amet</div>
</section>
<hr>
<section id="Second" class="current-date">
  <h1>Hello Second</h1>
  <div>Nunc non aliquet ipsum sed hendreri</div>
</section>
<hr>
<section id="Third" class="current-date">
  <h1>Hello Third</h1>
  <div>Sed condimentum cursus elit</div>
</section>

标签： javascript

解决方案

cDate = document.querySelectorAll(".current-date");
for(var i = 0; i < cDate.length; i++){
  
  var today = new Date();
var dd = String(today.getDate()).padStart(2, '0');
var mm = String(today.getMonth() + 1).padStart(2, '0'); 
var yyyy = today.getFullYear();
today = 'Updated ' + mm + '/' + dd + '/' + yyyy;
var span = document.createElement('span');
span.className = 'updated';
  span.textContent = today;
  
 cDate[i].prepend(span);

}
.updated {
  display: inline-block;
  color: black;
  font-weight: bold;
  background: coral;
  padding: 4px 10px;
}
<section id="First" class="current-date">
  <h1>Hello First</h1>
  <div>Lorem ipsum dolor sit amet</div>
</section>
<hr>
<section id="Second" class="current-date">
  <h1>Hello Second</h1>
  <div>Nunc non aliquet ipsum sed hendreri</div>
</section>
<hr>
<section id="Third" class="current-date">
  <h1>Hello Third</h1>
  <div>Sed condimentum cursus elit</div>
</section>

推荐阅读