如何使用JavaScript在页面加载中获取元标记的内容？

Question

我想在YouTube上获取meta代码的内容。但是，当我导航到新页面时，即使页面源已更新，仍会返回旧页面的内容。

请注意，我专注于YouTube的频道页面，这些页面充当单页应用。

重现：

1. 访问https://www.youtube.com/channel/UCBVjMGOIkavEAhyqpxJ73Dw（Maroon 5＆＃39;频道）
2. 在控制台中运行document.head.querySelector('meta[name="title"]');返回<meta name="title" content="Maroon 5">
3. 点击＆＃34;相关频道＆＃34;下的链接;在右侧边栏;例如，https://www.youtube.com/user/EdSheeran
4. 再次在控制台中运行document.head.querySelector('meta[name="title"]');仍然会返回<meta name="title" content="Maroon 5">

查看新的网页来源会显示meta标记已更新为<meta name="title" content="Ed Sheeran">。我还注意到在控制台中运行document.head.querySelector('title')会返回更新的<title>Ed Sheeran - YouTube</title>元素。

为什么querySelector调用仍会返回上一页的元数据？

Answer 1

  

为什么querySelector调用仍然返回上一页的元数据？

因为：我专注于YouTube的频道页面，它充当单页应用。

据推测，负责编写SPA代码的人在用JS更新其余DOM时没有更新元数据。

从服务器请求页面的新副本以查看源，获取正确的元数据，因为它是由服务器端代码而不是SPA代码生成的。