auto-query v1.6.2
auto-query
auto-query
是一个基于 cheerio
实现的自动查询 DOM 节点数据的工具函数。使用 auto-query
非常简单,只需要定义 schema 并且载入 html 即可,auto-query
会帮你解析出对于的数据结构。
Nodejs > 8.0,目前为 1.5.0 版本
install
yarn add auto-query
api
select
和 data
为特定的属性名称,当一个对象里有 select 和 data 属性时,会被判定为此对象为解析数据的对象。
autoQuery(html, schema);
const schema = {
title: {
select: String, // CSS 选择器
data: String | Function | Array, // 数据项,一般为回调函数,参数为 $el
}
};
autoQuery(html, schema); // 返回一个数据集
convenient function
auto-query
提供了一些便捷函数供使用。
#text
等效于 $el.text();#html
等效于 $el.html();#val
等效于 $el.val();#data
等效于 $el.data();@attr
等效于 $el.attr('attr');
例如,获取 <a>
的 href,可以使用 @href
:
const schema = {
url: {
select: '.name > a',
data: '@href',
},
};
如果字段为字符串,且 $
开头,将识别为选择器,并且返回元素的 text,这可以简化一些代码的编写。
例如 title1、title2、title3 是等效的。
const schema = {
title1: '$ .title',
title2: {
select: '.title',
data: $el => $el.text(),
},
title3: {
select: '.title',
data: '#text',
},
};
此外还提供了一些便捷的属性使用,对应的是 String/Array 的操作函数,如果函数参数为空,则对应的值为布尔值,否则为参数数组。。执行的顺序是按照,编写的属性顺序。
- String
trim
number
尝试把 string 转化 number。lower
upper
reverse
slice
substr
concat
match
replace
repeat
split
- Array
reverse
slice
concat
fill
join
splice
sort
map
filter
reduce
find
例如,下面的一系列操作:
const schema = {
title: {
select: 'head > title',
data: '#text', // abc, ACB, bac, cab,
trim: true, // 去除两边的空格
slice: [0, 100], // 只取前 100 个字符
lower: true, // 转为小写
replace: [/,/, '|'], // 把 , 替换为 |
split: ['|'], // 按照 | 进行切割
sort: [], // 字典排序as
},
};
const res = autoQuery(html, schema);
console.log(res.title); // ["abc", "acb", "bac", "cab"]
example
下面一个示例展示了,如何使用 auto-query
获取 html 对应的数据信息。
const got = require('got');
const autoQuery = require('../');
+ async function () {
const html = (await got('https://github.com/search?q=auto')).body;
const schema = {
title: '$ head > title',
results: {
select: 'ul.repo-list > div',
data: [{ // <-- 此除表明,解析的数据为数组
name: { select: 'h3', data: '#text', trim: true },
summary: { select: 'h3 + p', data: '#text', trim: true },
star: { select: '.text-right', data: '#text', trim: true },
url: { select: 'h3 > a', data: '@href' },
}],
},
};
const data = autoQuery(html, schema);
console.log(data);
/*
{ title: 'Search · auto · GitHub',
results:
[ { name: 'google/auto',
summary: 'A collection of source code generators for Java.',
star: '6.5k',
url: '/google/auto' },
{ name: 'AutoMapper/AutoMapper',
summary: 'A convention-based object-object mapper in .NET.',
star: '5.4k',
url: '/AutoMapper/AutoMapper' },
{ name: 'automerge/automerge',
summary: 'A JSON-like data structure that can be modified ...',
star: '5.4k',
url: '/automerge/automerge' },
{ name: 'NullArray/AutoSploit',
summary: 'Automated Mass Exploiter',
star: '3k',
url: '/NullArray/AutoSploit' },
{ name: 'postcss/autoprefixer',
summary: 'Parse CSS and add vendor prefixes to rules by Can I Use',
star: '15.2k',
url: '/postcss/autoprefixer' },
]
}
*/
} ();
array schema
当 schema 包含数组时,auto-query
会根据 css 选择器来解析列表数据。同时 auto-query
支持多种数组结构,具体看下面的示例。
const html = `
<ul class="list">
<li>
<a href="/l1">l1</a>
</li>
<li>
<a href="/l2">l2</a>
</li>
<li>
<a href="/l3">l3</a>
</li>
</ul>
`;
const schema = {
list1: [{
select: '.list > li > a',
data: '@href',
}],
list2: {
select: '.list > li', // 选择出来应该是数组
data: [{
url: {
select: '> a', // 选择器的范围缩小到 li 内
data: '@href',
},
link: {
text: {
select: '> a',
data: '#text',
},
},
}],
},
list3: {
select: '.list > li > a', // 全局范围
data: [{
select: '&', // 选择自己
data: '@href',
}],
},
list4: {
select: '.list > li > a',
data: [{
url: {
select: '&',
data: '@href',
},
}],
},
};
console.log(autoQuery(html, schema));
/**
{
list1: ['/l1', '/l2', '/l3'],
list2: [
{ url: '/l1', link: { text: 'l1' } },
{ url: '/l2', link: { text: 'l2' } },
{ url: '/l3', link: { text: 'l3' } },
],
list3: ['/l1', '/l2', '/l3'],
list4: [
{ url: '/l1' },
{ url: '/l2' },
{ url: '/l3' },
],
};
*/
React Native 上使用
auto-query
也可以在 React Native,在 React Native 上使用的是 cheerio-without-node-native
而不是 cheerio
,因为 cheerio
在 React Native 上报错。
目前,提供一个配置项 query,可以让你自己设置 cherrio。
const cheerio = require('cheerio');
autoQuery(html, schema, {
query: cheerio,
});
update logs
- v1.6.0 (2018-06-01): add options.
- v1.5.0 (2018-05-11): add index.d.ts.
- v1.2.0-beta (2018-05-10): support for react native.
- v1.1.0-beta (2018-05-07): query adds one parameter.
- v1.0.0-beta (2018-05-07): add auxiliary functions.
- v0.3.0 (2018-04-27): add a short operation.
- v0.2.0 (2018-04-27): rewrite the core algorithm.
- v0.1.0 (2018-04-26): implement basic functions.
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago