NPM酷库:jsdom,纯JS实现的DOM

NPM酷库,每天两分钟,了解一个流行NPM库。

昨天认识了一个在Node.js环境下操作HTML的库 cheerio,cheerio实现了jQuery接口,用起来十分方便。为什么不直接用jQuery呢?因为Node.js环境中没有实现DOM对象。

jsdom

今天,我们要学习的jsdom就是一个纯JS实现的DOM,jsdom可以在Node.js环境中“模拟出”DOM环境,像jQuery这样对DOM依赖的库就可以在Node.js中运行了。

const jsdom = require("jsdom");
const { JSDOM } = jsdom;

const dom = new JSDOM(`<!DOCTYPE html><p>Hello world</p>`);

dom.window.document.querySelector("p").textContent; // "Hello world"

const $ = require('jquery')(dom.window);

$('p').text(); // "Hello world"

上述代码中,首先实例化一个JSDOM对象dom,实例化参数就是我们要操作的HTML字符串,然后就可以通过 dom.window.document 等DOM标准接口访问HTML内容了。

最后两行,我们引入了jQuery库,并将jQuery的window参数绑定到dom对象上,我们就可以用jQuery来访问HTML文本。

如果你的需求是简单地操作HTML文本,我建议你仍然使用更加轻量的cheerio库,但是如果cheerio满足不了你的需求,或者你为了像兼容jQuery一样兼容某些依赖DOM的npm库,你可以尝试jsdom来解决你的问题。

参考资料

jsdom: https://github.com/tmpvar/jsdom

cheerio: https://github.com/cheeriojs/...

DOM: https://dom.spec.whatwg.org

欢迎关注公众号:梁兴臣

梁兴臣

每天了解一个NPM库,一年后成为Node.js高手

猜你喜欢

转载自www.cnblogs.com/jlfw/p/12055173.html