如何动态更改网页的标题？

javascript html

2022-08-29 22:39:20

我有一个网页，它实现了一组选项卡，每个选项卡显示不同的内容。单击选项卡不会刷新页面，而是在客户端隐藏/取消隐藏内容。

现在需要根据页面上选择的选项卡更改页面标题（出于SEO原因）。这可能吗？有人可以建议一个解决方案，通过javascript动态更改页面标题而不重新加载页面吗？

答案 1

更新：根据SearchEngineLand上的评论和参考，大多数网络爬虫将索引更新的标题。下面的答案已经过时，但代码仍然适用。

你可以做这样的事情，但这会完全违背SEO的目的。大多数爬虫一开始不会支持javascript，所以他们会把元素中的任何内容作为页面标题。document.title = "This is the new page title.";

如果您希望它与大多数重要的抓取工具兼容，则需要实际更改标题标签本身，这将涉及重新加载页面（PHP或类似内容）。如果你想以爬虫可以看到的方式更改页面标题，您将无法绕过它。

答案 2

我想从未来的:)最近发生的事情：

谷歌现在运行你网站上的javascript¹
人们现在使用React.js，Ember和Angular之类的东西在页面上运行复杂的javascript任务，它仍然被Google^1索引。
你可以使用html5历史api（pushState，react-router，ember，angular），它允许你做一些事情，比如为你想打开的每个标签页设置单独的网址，谷歌会索引¹

因此，要回答您的问题，您可以安全地从javascript更改标题和其他元标记（如果您想支持非Google搜索引擎，您也可以添加类似 https://prerender.io 之类的内容），只需将它们作为单独的URL访问即可（否则Google如何知道这些是在搜索结果中显示的不同页面？）。更改SEO相关标签（在用户通过单击某些内容更改页面后）很简单：

if (document.title != newTitle) {
    document.title = newTitle;
}
$('meta[name="description"]').attr("content", newDescription);

只要确保css和javascript在机器人中没有被阻止.txt，你可以在Google网站站长工具中使用Fetch as Google服务。

1： http://searchengineland.com/tested-googlebot-crawls-javascript-heres-learned-220157