您好,登錄后才能下訂單哦!
這篇文章主要為大家展示了“JS下常見的HTML解析庫有哪些”,內容簡而易懂,條理清晰,希望能夠幫助大家解決疑惑,下面讓小編帶領大家一起研究并學習一下“JS下常見的HTML解析庫有哪些”這篇文章吧。
DOMParser
JavaScript和jQuery的DOM操作功能非常適合簡單HTML片段的解析。在實際編程中,如果要以編程方式解析DOM完整HTML或XML,則需要一個更好的解決方案,那就是DOMParser,它是所有現代數瀏覽器都支持的功能。
通過使用DOMParser,可以輕松解析HTML文檔。但是,一般需要通過欺騙瀏覽器來實現解析,比如,通過向當前文檔添加新元素。
DOMParser的用法非常簡單明了:
let domParser = new DOMParser(); let doc = domParser.parseFromString(stringContainingXMLSource, "application/xml"); domParser = new DOMParser(); doc = domParser.parseFromString(stringContainingSVGSource, "image/svg+xml"); domParser = new DOMParser(); doc = domParser.parseFromString(stringContainingHTMLSource, "text/html");
Cheerio
專為服務器設計的核心jQuery的快速,靈活和精致的實現。
Cheerio看起來像jQuery,但是不支持瀏覽器。Cheerio可以解析HTML并使其易于操作,但不會像瀏覽器中那樣解釋HTML,解析出與瀏覽器不同的內容,并且解析的結果不會直接發送給用戶。
Cheerio實現了jQuery子集,去掉了jQuery中所有與DOM不一致或者是用來填補瀏覽器的東西,重現了jQuery最美妙的API
由于使用了極其簡潔而又標準的DOM模型, Cheerio對文檔的轉換,操作,渲染都極其的高效。
JavaScript開發人員都應該熟悉Cheerio的語法和用法:
var chro = require('cheerio'), $ = chio.load('<h2 class="title">Hello World!</h2>'); $('h2.title').text('Hello Chongchong!'); $('h2').attr('id', 'welcome'); $.html();結果:<h2 class="title" id=" welcome ">Hello Chongchong!</h2>
jsdom
jsdom是很多Web標準(尤其是WHATWG DOM和 HTML 標準)純JavaScript實現,可與Node.js結合使用。jsdom項目的目標是模擬Web瀏覽器的子集,從而滿足測試和抓取實際的Web應用程序。
jsdom不僅僅是HTML解析器,它還可以當成瀏覽器。在解析的上下文中,如果要解析的數據中省略了必要的標記,它會自動添加必要的標記。例如,如果沒有html標簽,它將像瀏覽器一樣隱式地添加它。
還可以選擇指定一些屬性,例如文檔,引薦來源網址或用戶代理的URL。如果需要解析包含本地URL的鏈接,則該URL特別有用。
由于它實際上與解析無關,因此只提到jsdom具有(虛擬)控制臺,對cookie的支持等。總之,需要模擬瀏覽器環境
它還可以處理外部資源。如有需求jsdom可以用來加載并執行JS腳本。
const jsdom = require("jsdom"); const { JSDOM } = jsdom;const dom = new JSDOM('<!DOCTYPE html><p>Hello, Chongchong!</p>'); console.log(dom.window.document.querySelector("p").textContent);
結果:
"Hello, Chongchong!"
parse5
parse5提供了處理HTML時所需的幾乎所有內容。Parse5庫,目標是構建其他工具,但也可以實現HTML解析以完成簡單任務。Parse5易于使用,但是并不提供瀏覽器為提供的操作DOM的方法(例如getElementById)。
parse5衍生出了一系列采用它的令人印象深刻的項目:jsdom,Angular2和Polymer。如果需求為對HTML的高級操作或解析的可靠基礎,那么顯然這是一個不錯的選擇。
const parse5 = require('parse5'); const document = parse5.parse('<!DOCTYPE html><html><head></head><body>Hello Chongchong!</body></html>'); console.log(document.childNodes[1].tagName);
以上是“JS下常見的HTML解析庫有哪些”這篇文章的所有內容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內容對大家有所幫助,如果還想學習更多知識,歡迎關注億速云行業資訊頻道!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。