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高手
NPM酷库：jsdom，纯JS实现的DOM的更多相关文章
- Highcharts纯js图表库，以后可以跟客户说，你跟阿里云ECS用的图表库是同款
Highcharts是一款纯javascript编写的图表库,能够很简便的在Web网站或Web应用中添加交互性的图表,Highcharts目前支持直线图.曲线图.面积图.柱状图.饼图.散点图等多达18 ...
- 纯js实现复制到剪贴板功能
在网页上复制文本到剪切板,一般是使用JS+Flash结合的方法,网上有很多相关文章介绍.随着 HTML5 技术的发展,Flash 已经在很多场合不适用了,甚至被屏蔽.本文介绍的一款JS插件,实现了纯J ...
- baguetteBox.js响应式画廊插件(纯JS)
baguetteBox.js baguetteBox.js 是一个简单和易于使用lightbox纯JavaScript脚本,拥有图像放大缩小并带有相应的CSS3过度,并能在触摸屏等设备上完美展示. D ...
- 纯 js 让浏览器不缓存 ajax 请求
开发「bufpay.com 个人即时到账收款平台」支付页面需要用到 ajax 轮询订单的支付状态. 现在浏览器对 ajax 的缓存策略遵循 http response header 里面的缓存设置,为 ...
- 基于Vue的npm组件库
前言(*❦ω❦) 思维导图可能有点高糊,有点太大了,项目和导图文件放到github或giteee上,这个思维导图也是我文章的架构,思维导图是用FeHelper插件生成的,这个是一款开源chrome插件 ...
- 纯JS实现俄罗斯方块，打造属于你的游戏帝国
纯JS俄罗斯方块,打造属于你的游戏帝国. 本文原始作者博客 http://www.cnblogs.com/toutou 俄罗斯方块(Tetris, 俄文:Тетрис)是一款电视游戏机和掌上游戏机游戏 ...
- F2工作流引擎之-纯JS Web在线可拖拽的流程设计器（八）
Web纯JS流程设计器无需编程,完全是通过鼠标拖.拉.拽的方式来完成,支持串行.并行.分支.异或分支.M取N路分支.会签.聚合.多重聚合.退回.传阅.转交,都可以非常方便快捷地实现,管理员 ...
- ［原创］纯JS实现网页中多选复选框checkbox和单选radio的美化效果
图片素材: 最终效果图: <html><title> 纯JS实现网页中多选复选框checkbox和单选radio的美化效果</title><head>& ...
- 纯js异步无刷新请求(只支持IE)
纯js异步无刷新请求 下载地址:http://pan.baidu.com/s/1slakL1F 所以因为非IE浏览器都禁止跨域请求,所以以只支持IE. <HTML> <!-- 乱码( ...
随机推荐
- 【记录】编译安装 YAML 扩展
转自:https://learnku.com/articles/30985 Yaml,专门用来写配置文件的语言 依赖安装 $ sudo apt-get install libyaml-dev ...
- IPD术语
集成产品开发(Integrated Product Development,简称IPD)是一套产品开发的模式.理念与方法. ABC 基于活动的成本核算 ABM 基于活动的管理 ADCP 可获得性决策 ...
- Beta冲刺博客
这个作业属于哪个课程 当然是属于程序分析与设计呀 这个作业要求在哪里 在这儿 团队名称 六扇门编程小组(团队博客) 这个作业的目标 完成为期两周的β版本冲刺 1.团队信息 姓名 学号 曹欢(组长) 2 ...
- hdoj1561 The more, The Better （树形dp，分组背包）
题目链接:https://vjudge.net/problem/HDU-1561 题意:给一个森林,每个结点有个权值,求选m个结点的最大权值和,并且选子结点前必须先选父结点. 思路: 把每颗树的树根连 ...
- oracle——学习之路（select检索）
select语法: select [distinct|all] 列名 from 表名 [where] [group by] [having] [order ...
- 如何使用RedisTemplate访问Redis数据结构之list
Redis的List数据结构 这边我们把RedisTemplate序列化方式改回之前的 Jackson2JsonRedisSerializer<Object> jackson2JsonRe ...
- Linux系列（12）之例行工作调度
你知道工作调度有哪几种吗? 你知道在进行工作调度时需要哪些服务在运行吗? 你知道突发性工作调度的指令at的用法吗? 知道如何管理at的工作调度吗? 知道at指令进行工作调度的原理吗? 知道什么是背景任 ...
- hdu 6319 逆序建单调队列
题目传送门//res tp hdu 维护递增单调队列 根据数据范围推测应为O(n)的. 我们需要维护一个区间的信息,区间内信息是"有序"的,同时需要在O(1)的时间进行相邻区间的信 ...
- Python【函数使用技巧】
写成“子函数+主函数”的代码结构,也是因为每个不同的功能封装在单独的函数代码中,方便后续修改.增删 import math # 变量key代表循环运行程序的开关 key = 1 # 采集信息的函数 d ...
- Linux 网络工具netcat(nc)的应用
NETCAT netcat是Linux常用的网络工具之一,它能通过TCP和UDP在网络中读写数据,通过与其他工具结合和重定向,可以在脚本中以多种方式使用它. netcat所做的就是在两台电脑之间建立链 ...