使用JavaScript运行行的日期时间< title>

nwsw7zdq 于 2023-04-10 发布在 Java

关注(0)|答案(2)|浏览(91)

我有一个JavaScript程序，它在页面标题（）中显示当前日期和时间，然后我尝试将此标题动画为爬行线，但没有任何效果。尝试使用切片方法和substring方法，但没有任何效果。

function updateDateTime() {
  let datetime = new Date();
  let datetimeString = datetime.toLocaleString();
  document.title = datetimeString;
}
setInterval(updateDateTime, 1000); // оновлюємо час кожну секунду

updateDateTime();

let marquee = document.getElementById("marquee");
let datetime = document.getElementById("datetime");

function shiftDateTime() {
  const unit = "px";
  let position = Number.parseInt(datetime.style.right) || 0;
  let width = datetime.offsetWidth;

  position = position > marquee.offsetWidth ?
    -width :
    position + 1;

  datetime.style.right = position + unit;
  requestAnimationFrame(shiftDateTime);
}

shiftDateTime();

<!DOCTYPE html>
<html>

<head>
  <title>Date&Time marquee</title>
</head>

<body>
  <div id="marquee">
    <span id="datetime"></span>
  </div>
</body>

</html>

这是我的代码，我所能做的就是在标题中显示当前的日期和时间。最后，我们的程序应该在页面标题中显示当前的日期和时间，并将它们从右到左显示为一条连续的线。我怎么做呢？

JavaScript

来源：https://stackoverflow.com/questions/75966082/date-time-running-line-in-title-using-javascript

2条答案

按热度按时间

xqk2d5yq1#

第一个空格字符不能在html标题元素中使用。
您可以使用_代替。

let tittlemov = 0;
setInterval(()=>
  { 
  document.title = '_'.repeat(tittlemov++) 
                 + new Date().toLocaleString() 
                 + '_'.repeat(10 - tittlemov);
  tittlemov %= 10;
  }, 1000 );

赞(0）回复(0）举报 2023-04-10

dwbf0jvd2#

只需在每次迭代时添加一个空格：

let i = 0;
function updateDateTime() {
  const datetime = new Date();
  const datetimeString = datetime.toLocaleString();
  const trailingSpaces = Array(i).fill().map(_=>' ').join('');
  document.title = trailingSpaces + datetimeString;
  i = (i + 1) % 10;
}
setInterval(updateDateTime, 100);

<!DOCTYPE html>
<html>

<head>
  <title>Date&Time marquee</title>
</head>

<body>
  <div id="marquee">
    <span id="datetime"></span>
  </div>
</body>

</html>

赞(0）回复(0）举报 2023-04-10

我来回答

使用JavaScript运行行的日期时间< title>

2条答案

相关问题

热门标签

最新问答