手机版 收藏 导航

JavaScript 改变网页标题的技巧有哪些

原创   www.link114.cn   2023-10-08 11:53:19

JavaScript 改变网页标题的技巧有哪些

最简单的方法是直接设置 document.title 属性的值。例如:

document.title = "新的页面标题";

我们也可以通过 DOM 操作来改变标题元素 <title>。例如:

var titleElement = document.querySelector("title");
titleElement.textContent = "新的页面标题";

可以将标题的改变与某些事件绑定,比如用户点击某个按钮时改变标题:

var button = document.getElementById("myButton");
button.addEventListener("click", function() {
  document.title = "新的页面标题";
});

我们还可以使用定时器,周期性地改变标题,以达到动态效果:

setInterval(function() {
  document.title = "新的页面标题" + new Date().toLocaleTimeString();
}, 1000);

在单页应用(SPA)中,我们可以利用框架提供的方法来改变标题,例如在 React 中使用 document.title = "新的页面标题"