大多数单页应用程序(SPA(只提供最小的静态HTML框架,然后动态构建整个页面。这也适用于HTML标头<head>
中的标记。
今天,我遇到了一个动态添加RSS提要的问题。客户端脚本的关键部分看起来像
// During SPA initialization routine
const head = document.querySelector('head');
config.rss_feeds.forEach(function (feed){
const link = document.createElement('link');
link.rel = "alternate";
link.type = feed.mimetype;
link.href = feed.url;
link.title = feed.title;
head.appendChild(link);
});
不要担心config
对象是什么。这个对象是由后端通过以前的AJAX请求提供给SPA的,包含SPA的所有必要配置。但它是相当直接的。SPA为每个RSS提要创建一个<link>
元素,并将其附加到<head>
。
当我查看我的开发人员面板并检查HTMLDOM时,<link>
标记就会按预期存在。然而,RSS阅读器似乎不会自动检测到提要。我主要尝试使用Firefox和各种插件,但结果总是负面的。
我想,RSS插件只在加载后立即分析HTML页面onyce,但不考虑Javascript引起的任何更改。
如何通过JavaScript为动态添加的<link>
标签启用RSS提要自动检测
优选地,解决方案应该跨客户端工作,即在Firefox、Chrome、Edge、Safari等中;重新扫描标题";?
我猜,RSS插件只在加载后立即分析HTML页面,但不考虑Javascript引起的任何更改。
一般来说,是的。
如何通过JavaScript为动态添加的标签启用RSS提要自动检测?
你不能。他们只看HTML。你没有办法在每个人使用的所有RSS软件中添加JavaScript支持。
您需要生成的不仅仅是骨架HTML。这通常被称为预呈现,通常采取两种形式之一:
- 在构建时生成静态HTML页面
- 使用服务器端呈现生成HTML
像Next.js这样的框架往往带有内置的功能。
如果你有一个RSS提要,那么你可能想看看服务器端的渲染(因为有RSS意味着你的内容经常更新(。