1

我想通过将其嵌入到我正在处理的站点中来提供与所有浏览器的 Firefox 阅读器视图非常相似的功能，以便可以通过单击开关或类似的东西来启用它。

我发现Mozilla 的 Readability 存储库将自己描述为：

用于 Firefox Reader View 的可读性库的独立版本。

我将它导入到我的站点中，并添加了一个开关，用从这个库中获得的 HTML 替换主页内容，但它只提供了 Firefox 阅读器视图的一些功能。它剥离了各种非文本元素，只留下了一个简单的文本和图像页面，但它缺少 Firefox 阅读器视图使用的样式，更重要的是它缺少允许用户动态自定义页面/文本样式的浮动工具栏, 或让他们读给他们听。

然后我找到了 Firefox 阅读器视图的源代码，但是将它与我​​正在开发的网站集成起来似乎至少会相当复杂，如果不进行大量重写的话，如果不是不可能的话。有没有办法在网站中嵌入 Firefox 的阅读器视图？

这不是如何在我的网站上实现 Mozilla readability.js？，因为我已经readability.js为我正在开发的网站实现了。这是我如何做到这一点的精简示例：

import { Readability } from '@mozilla/readability';

function htmlToElement(htmlString) {
    const template = document.createElement('template');
    template.innerHTML = htmlString.trim();
    return template.content.firstChild;
}

document.getElementsByClassName('layoutmain')[0].replaceWith(
    htmlToElement(
        new Readability(document.cloneNode(true)).parse().content
    )
);

我正在使用Svelte，它负责上面代码中的导入，但我认为这在很大程度上与手头的问题无关。

4

0 回答 0