如何解决如何使用类对每个元素执行js函数
我编写了一个脚本,该脚本从以下时间范围设置的时间中抽出时间:“ 2020年10月29日格林威治标准时间”,并将其交换为用户所在时区中的计算日期。
问题在于该代码仅适用于第一个跨度,我是javascript的新手,我无法全神贯注于如何创建foreach循环。有人可以帮助我调整脚本,以便遍历提供的html吗?预先感谢。
JavaScript:
var timestamp = document.getElementById('timestamp'),t = new Date(timestamp.innerHTML),hours = t.getHours(),min = t.getMinutes() + '',pm = false,months = ['January','February','March','April','May','June','July','August','September','October','November','December'];
if(hours > 11){
hours = hours - 12;
pm = true;
}
if(hours == 0) hours = 12;
if(min.length == 1) min = '0' + min;
timestamp.innerHTML = months[t.getMonth()] + ' ' + t.getDate() + ',' + t.getFullYear() + ' ' + hours + ':' + min + ' ' + (pm ? 'pm' : 'am') + ',' + Intl.DateTimeFormat().resolvedOptions().timeZone + ' time';
HTML:
<span class="timestamp">October 29,2020 9:00 am GMT</span><br>
<span class="timestamp">October 29,2020 2:00 am GMT</span><br>
<span class="timestamp">October 29,2020 4:00 am GMT</span><br>
<span class="timestamp">October 30,2020 3:00 am GMT</span><br>
<span class="timestamp">October 28,2020 7:00 am GMT</span><br>
<span class="timestamp">October 29,2020 8:00 am GMT</span><br>
解决方法
您应该给所有元素一个“时间戳”类,因为ID意味着唯一。然后,您可以使用document.querySelectorAll
获取所有元素。
document.querySelectorAll('.timestamp').forEach(timestamp=>{
let t = new Date(timestamp.innerHTML),hours = t.getHours(),min = t.getMinutes() + '',pm = false,months = ['January','February','March','April','May','June','July','August','September','October','November','December'];
if(hours > 11){
hours = hours - 12;
pm = true;
}
if(hours == 0) hours = 12;
if(min.length == 1) min = '0' + min;
timestamp.innerHTML = months[t.getMonth()] + ' ' + t.getDate() + ',' + t.getFullYear() + ' ' + hours + ':' + min + ' ' + (pm ? 'pm' : 'am') + ',' + Intl.DateTimeFormat().resolvedOptions().timeZone + ' time';
});
,
该ID必须是唯一的,最好使用时间戳作为类名。因此,您可以使用document.getElementsByClassName
来获取所有这些信息。
let timestamps = document.getElementsByClassName('timestamp');
//console.log(timestamps,timestamps.length);
for (let i=0; i<timestamps.length; i++) {
let t = new Date(timestamps[i].innerHTML),'December'];
if(hours > 11){
hours = hours - 12;
pm = true;
}
if(hours == 0) hours = 12;
if(min.length == 1) min = '0' + min;
timestamps[i].innerHTML = months[t.getMonth()] + ' ' + t.getDate() + ',' + Intl.DateTimeFormat().resolvedOptions().timeZone + ' time';
}
<span class="timestamp">October 29,2020 9:00 am GMT</span><br>
<span class="timestamp">October 29,2020 2:00 am GMT</span><br>
<span class="timestamp">October 29,2020 4:00 am GMT</span><br>
<span class="timestamp">October 30,2020 3:00 am GMT</span><br>
<span class="timestamp">October 28,2020 7:00 am GMT</span><br>
<span class="timestamp">October 29,2020 8:00 am GMT</span><br>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。