已解決430363個問題，去搜搜看，總會有你想問的

如何實現 Mozilla 的可讀性.js我的網站？

首頁猿問如何實現 Mozilla...

如何實現 Mozilla 的可讀性.js我的網站？

JavaScript

慕的地6264312 2022-09-29 15:54:41

https://github.com/mozilla/readability（可讀性.js用于創建網頁的讀取視圖）如何實現可讀性.js此測試網頁的問題是，可讀性.js刪除了本網站的元素，我想保留并留下那些應該刪除的元素。我希望有人能幫助我。謝謝！是否有任何關于如何使用可讀性的文檔.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>測試頁面的來源：優化網站以在 Firefox 中顯示讀者視圖

查看完整描述

3 回答

元芳怎么了

TA貢獻1798條經驗獲得超7個贊

您可以將DOM純化和可讀性一起使用，就像他們在文檔中提到的那樣 -

import { Readability } from '@mozilla/readability'

import DOMPurify from 'dompurify';

function readable(doc) {

const reader = new Readability(doc)

const article = reader.parse()

return article

}

let cloneDoc = document.cloneNode(true)

let parsed = readable(cloneDoc)

const markup = DOMPurify.sanitize(parsed.content)

markup將是可讀內容的 html 字符串。嘗試查看可用的屬性。console.log(parsed)

反對回復 2022-09-29

慕村9548890

TA貢獻1884條經驗獲得超4個贊

你試過這個嗎？

從他們的github頁面：

“可讀性的解析（）通過修改DOM來工作。這將刪除網頁中的某些元素。您可以通過在創建可讀性對象時傳遞文檔對象的克隆來避免這種情況。

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

您可以創建 dom 對象的副本，這樣您就不會實際修改實際的 dom

反對回復 2022-09-29

拉風的咖菲貓

TA貢獻1995條經驗獲得超2個贊

好。。。。

    document.getElementById("body").innerHTML = "<font face='Calibri' size='4'> 
    <h1>"+article.title+"</h1>"+article.content;

反對回復 2022-09-29

3 回答
0 關注
168 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

如何實現 Mozilla 的可讀性.js我的網站？

如何實現 Mozilla 的可讀性.js我的網站？

3 回答

添加回答

如何實現 Mozilla 的可讀性.js我的網站？