HTML5 & # 39;时间# 39;标签设置值不正确

HTML5 'time' tag not setting value properly

本文关键字:不正确 设置 标签 HTML5 时间      更新时间:2023-09-26

我有以下代码:

<html>
<script>

setInterval("settime()", 1000);
function settime () {
  var dateTime = new Date();
  var hours = dateTime.getHours();
  var minutes = dateTime.getMinutes();
  var time = "";
  if (hours === 0) { 
    hours = 12;
  }
  time = (hours > 12 ? hours - 12 : hours) + ":" +
         (minutes < 10 ? "0" : "") + minutes + (hours > 12 ? "PM" : "AM");
  // Doesn't work at all...
  document.getElementsByTagName('time').textContent = time;
  document.getElementsByTagName('time').innerHTML = time;

  console.log('Time set with js: ' + document.getElementsByTagName('time').textContent);
  // Works fine...
    //$('time').text(time);
}
</script>
<body>
    <time></time>
</body>
</html>

为什么常规的JS不工作,但jQuery text()工作得很好?

小提琴

因为document.getElementsByTagName返回一个nodeList而不是单个元素,所以必须指定哪个。节点列表的工作方式类似于数组,如下所示:

document.getElementsByTagName('time')[0].innerHTML = time;

http://jsfiddle.net/4EqxW/3/

注意document.getElementsByTagName('time')[0].部分

http://jsfiddle.net/4EqxW/4/

getElementsbyTagName是返回数组的节点(NodeList),所以你必须指定到哪个元素你访问属性

Marek Sebera和"amosrivera"回答了你问题的第一部分(主要部分)

然后回答你问题的第二部分…

jQuery的"text()"方法将执行所需的结果所有的元素,匹配您的原始选择器(aka…

Try

document.getElementsByTagName('time')[0].textContent = time;
document.getElementsByTagName('time')[0].innerHTML = time;

注意getElementsByTagName返回一个NodeList,它是一个数组,而不是单个元素。代码变更结果