BrowserX
browser-x 是一个基于 NodeJS 实现的轻量级“浏览器”,它的目标是高效的实现 DOM 中最核心的特性,以便开发者能够在 NodeJS 中使用 W3C 标准方法来操作文档与样式。
安装
npm install browser-x
接口
browser(options, callback)
返回:Promise
var browser = require('browser-x');
var url = __dirname + '/debug.html';
browser({
url: url,
loadCssFile: true,
silent: false
}, function (errors, window) {
if (errors) {
throw errors;
}
var document = window.document;
var element = document.querySelector('#banner h2');
var fontFamily = window.getComputedStyle(element, '::after').fontFamily;
console.log(fontFamily);
});
options
{
/**
* 文件基础路径
*/
url: 'about:blank',
/*
* HTML 文本内容
*/
html: null,
/**
* 是否支持加载外部 CSS 文件
*/
loadCssFile: false,
/**
* 是否忽略内部解析错误-关闭它有利于开发调试
* @type {Boolean}
*/
silent: true,
/**
* 请求超时限制
* @type {Number} 毫秒
*/
resourceTimeout: 8000,
/**
* 最大的文件加载数量限制
* @type {Number} 数量
*/
resourceMaxNumber: 64,
/**
* 是否缓存请求成功的资源
* @return {Object}
*/
resourceCache: true,
/**
* 映射资源路径
* @param {String} 旧文件地址
* @return {String} 新文件地址
*/
resourceMap: function(file) {
return file;
},
/**
* 忽略资源
* @param {String} 文件地址
* @return {Boolean} 如果返回`true`则忽略当当前文件的加载
*/
resourceIgnore: function(file) {
return false;
},
/**
* 资源加载前的事件
* @param {String} 文件地址
*/
resourceBeforeLoad: function(file) {
},
/**
* 加载远程资源的自定义请求头
* @param {String} 文件地址
* @return {Object}
*/
resourceRequestHeaders: function(file) {
return {
'accept-encoding': 'gzip,deflate'
};
}
}
运行单元测试
克隆源码,然后进入源码目录执行:
npm test
支持的 DOM API
- Window
- Document
- Element
- HTMLElement
- Node
注意事项
- 不支持 XML 文档解析
- 所有的 DOM 属性均为只读(计划在下一版本支持写入)
- window.getComputedStyle() 仅能获取元素或伪元素在 CSS 中定义的原始值或继承属性,但没有进行计算输出(例如 em > px)
- document.styleSheets 在浏览器中无法跨域访问 CSSOM,browser-x 没有做此限制
- 不支持浏览器怪异模式
为什么使用 browser-x
browser-x 适合做这些事情:
- 高效的爬虫程序,使用 CSS 选择器来收集内容
- 分析元素的样式使用情况,例如和 CSS 相关的开发工具
例如:WebFont 压缩工具——font-spider
如果需要更多的 DOM 特性,例如跑基于 DOM 的测试脚本、甚至载入 jQuery 等,那么 jsdom 这个项目可能会更适合你(注意:它没有完整解析样式表)。