readability

readability

关注
发信
关注(28)粉丝(399)

如何在我的网站上实现 Mozilla readability.js?

本文介绍了如何在我的网站上实现 Mozilla readability.js?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

https://github.com/mozilla/readability(readability.js 用于创建网页的阅读视图)

如何在这个测试网页上实现 readability.js问题是，readability.js 删除了这个网站的元素，我想保留并留下那些应该删除的元素.我希望有一个人可以帮助我.谢谢！是否有关于如何使用 readability.js 的文档?

<title>阅读器视图仅显示阅读器视图中的浏览器</title><script src="https://raw.githack.com/mozilla/readability/master/Readability.js"></script><身体>主 div 标签之外的所有内容都将在阅读器视图中消失
<img class="no-print" src="http://dummyimage.com/1024x100/000/ffffff&text=This+banner+should+vanish+in+print+view"><div><h1>在 p 标签外的 H1 标签隐藏在阅读器视图中</h1><img class="no-print" src="http://dummyimage.com/1024x100/000/ffffff&text=This+banner+resized+in+print+view"><p>12345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012945671234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901294567123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890129456712345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012945671234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901294567123456789 123456</p>

<脚本>var article = new Readability(document).parse();</html>

测试页面的来源:优化网站以显示读者视图火狐

解决方案

你试过了吗?

来自他们的 github 页面:

"Readability 的 parse() 通过修改 DOM 来工作.这会删除网页中的一些元素.您可以通过在创建 Readability 对象时传递文档对象的副本来避免这种情况."

var documentClone = document.cloneNode(true);var article = new Readability(documentClone).parse();

你可以复制 dom 对象，这样你就不会真正修改真正的 dom

https://github.com/mozilla/readability (readability.js is for creating a read view for web pages)

How can I implement readability.js to this test WebpageThe problem is, readability.js deletes the elements of this website, that I want to keep and leaves those that should be removed. I hope someone can help me. Thank you! Is there any documentation on how to use readability.js?

<html><head>
<title>Reader View shows only the browser in reader view</title>
    <script src="https://raw.githack.com/mozilla/readability/master/Readability.js"></script>
</head>
<body>
Everything outside the main div tag vanishes in Reader View<br>
<img class="no-print" src="http://dummyimage.com/1024x100/000/ffffff&text=This+banner+should+vanish+in+print+view">
<div>
   <h1>H1 tags outside ot a p tag are hidden in reader view</h1>
   <img class="no-print" src="http://dummyimage.com/1024x100/000/ffffff&text=This+banner+is resized+in+print+view">
   <p>
 123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789
 123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789
 123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789
 123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789
 123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789
 123456789 123456
</p>
</div>
</body>
    <script>
    var article = new Readability(document).parse();
    </script>
</html>

source of the Test page: Optimize website to show reader view in Firefox

解决方案

Did you try this?

From their github page:

"Readability's parse() works by modifying the DOM. This removes some elements in the web page. You could avoid this by passing the clone of the document object while creating a Readability object."

var documentClone = document.cloneNode(true);
var article = new Readability(documentClone).parse();

You can make a copy of the dom object so that you're not actually modifying the real dom

这篇关于如何在我的网站上实现 Mozilla readability.js?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

05-17 13:23
Powered by LMLPHP ©2024 readability 0.054906