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高手

NPM酷库:jsdom,纯JS实现的DOM的更多相关文章

  1. Highcharts纯js图表库,以后可以跟客户说,你跟阿里云ECS用的图表库是同款

    Highcharts是一款纯javascript编写的图表库,能够很简便的在Web网站或Web应用中添加交互性的图表,Highcharts目前支持直线图.曲线图.面积图.柱状图.饼图.散点图等多达18 ...

  2. 纯js实现复制到剪贴板功能

    在网页上复制文本到剪切板,一般是使用JS+Flash结合的方法,网上有很多相关文章介绍.随着 HTML5 技术的发展,Flash 已经在很多场合不适用了,甚至被屏蔽.本文介绍的一款JS插件,实现了纯J ...

  3. baguetteBox.js响应式画廊插件(纯JS)

    baguetteBox.js baguetteBox.js 是一个简单和易于使用lightbox纯JavaScript脚本,拥有图像放大缩小并带有相应的CSS3过度,并能在触摸屏等设备上完美展示. D ...

  4. 纯 js 让浏览器不缓存 ajax 请求

    开发「bufpay.com 个人即时到账收款平台」支付页面需要用到 ajax 轮询订单的支付状态. 现在浏览器对 ajax 的缓存策略遵循 http response header 里面的缓存设置,为 ...

  5. 基于Vue的npm组件库

    前言(*❦ω❦) 思维导图可能有点高糊,有点太大了,项目和导图文件放到github或giteee上,这个思维导图也是我文章的架构,思维导图是用FeHelper插件生成的,这个是一款开源chrome插件 ...

  6. 纯JS实现俄罗斯方块,打造属于你的游戏帝国

    纯JS俄罗斯方块,打造属于你的游戏帝国. 本文原始作者博客 http://www.cnblogs.com/toutou 俄罗斯方块(Tetris, 俄文:Тетрис)是一款电视游戏机和掌上游戏机游戏 ...

  7. F2工作流引擎之-纯JS Web在线可拖拽的流程设计器(八)

          Web纯JS流程设计器无需编程,完全是通过鼠标拖.拉.拽的方式来完成,支持串行.并行.分支.异或分支.M取N路分支.会签.聚合.多重聚合.退回.传阅.转交,都可以非常方便快捷地实现,管理员 ...

  8. [原创]纯JS实现网页中多选复选框checkbox和单选radio的美化效果

    图片素材: 最终效果图: <html><title> 纯JS实现网页中多选复选框checkbox和单选radio的美化效果</title><head>& ...

  9. 纯js异步无刷新请求(只支持IE)

    纯js异步无刷新请求 下载地址:http://pan.baidu.com/s/1slakL1F 所以因为非IE浏览器都禁止跨域请求,所以以只支持IE. <HTML> <!-- 乱码( ...

随机推荐

  1. Reactor系列(五)map映射

    #java# #reactor# #flux# #map# #映射# 视频解视: https://www.bilibili.com/video/av79179444/ FluxMonoTestCase ...

  2. 学习笔记:CentOS7学习之二十四:expect-正则表达式-sed-cut的使用

    目录 学习笔记:CentOS7学习之二十四:expect-正则表达式-sed-cut的使用 24.1 expect实现无交互登录 24.1.1 安装和使用expect 24.2 正则表达式的使用 24 ...

  3. 《你必须知道的495个C语言问题》读书笔记之第8-10章:字符串、布尔类型和预处理器

    一.字符和字符串 1. Q:为什么strcat(string, '!')不行? A:strcat()用于拼接字符串,所以应该写成strcat(string, "!")." ...

  4. 待解决问题 jscore 与 node.js jsbridge

    jscore 与 node.js  jsbridge https://juejin.im/post/5b395eb96fb9a00e556123ef

  5. 记笔记的软件(vnote)

    前面我们已经把我们的 Ubuntu 系统在物理机上运行起来了,也做了一些简单的优化,教了大家怎么使用 Ubuntu 系统自带的应用商店和 apt 安装和卸载软件.接着我们安装了搜狗输入法,现在我们的系 ...

  6. 使用Visual Studio2019 开启Openmp的方法

    调试-->属性-->C/C++-->所有选项-->Openmp支持改为 是(可以使用下拉菜单) 严重性 代码 说明 项目 文件 行 禁止显示状态 禁止显示状态 错误 C2338 ...

  7. Scala学习十八——高级类型

    一.本章要点 单例类型可用于方法串接和带对象参数的方法 类型投影对所有外部类的对象都包含了其他内部类的实例 类型别名给类型指定一个短小的名称 结构类型等效于”鸭子类型“ 存在类型为泛型的通配参数提供了 ...

  8. 阿里云=>RHSA-2019:1884-中危: libssh2 安全更新

    由于项目构建时间比较长,近期安全检查发现openssh有漏洞.所以要升级openssh到7.9p1版本.由于ssh用于远程连接,所以要谨慎操作. 建议生成环境要先做测试,之后再在生产环境升级. 1 前 ...

  9. Java通过JDBC连接SQL Server

    下载Microsoft JDBC Driver 4.0 for SQL Server 在这里下载:http://www.microsoft.com/zh-cn/download/details.asp ...

  10. 1.JavaWeb 知识点概览

    1.tomcat服务器的安装和配置.http协议 1.1 虚拟目录的 /*映射*/(配置Context元素)(server.xml catalina\localhost\) http://blog.c ...