是否可以使用Node.js在服务器端使用jQuery选择器/ DOM操作?
更新(27-Jun-18):看起来有一个重大更新jsdom
,导致原始答案不再有效.我发现这个答案解释了jsdom
现在如何使用.我已复制下面的相关代码.
var jsdom = require("jsdom"); const { JSDOM } = jsdom; const { window } = new JSDOM(); const { document } = (new JSDOM('')).window; global.document = document; var $ = jQuery = require('jquery')(window);
注意:原始答案没有提到你需要安装jsdom以及使用npm install jsdom
更新(2013年末):官方jQuery团队终于jquery
在npm 接管了包的管理:
npm install jquery
然后:
require("jsdom").env("", function (err, window) { if (err) { console.error(err); return; } var $ = require("jquery")(window); });
是的,您可以使用我创建的名为nodeQuery https://github.com/tblobaum/nodeQuery的库
var Express = require('express') , dnode = require('dnode') , nQuery = require('nodeQuery') , express = Express.createServer(); var app = function ($) { $.on('ready', function () { // do some stuff to the dom in real-time $('body').append('Hello World'); $('body').append(''); $('input').live('click', function () { console.log('input clicked'); // ... }); }); }; nQuery .use(app); express .use(nQuery.middleware) .use(Express.static(__dirname + '/public')) .listen(3000); dnode(nQuery.middleware).listen(express);
在撰写本文时,还有维持的Cheerio.
专为服务器设计的核心jQuery的快速,灵活和精益实现.
使用jsdom你现在可以.只需在examples目录中查看它们的jquery示例即可.
这是我在Node.js中制作一个简单爬虫的公式.这是想要在服务器端进行DOM操作的主要原因,也许这就是你到这里的原因.
首先,用于request
下载要解析的页面.下载完成后,处理它cheerio
并开始DOM操作就像使用jQuery一样.
工作范例:
var
request = require('request'),
cheerio = require('cheerio');
function parse(url) {
request(url, function (error, response, body) {
var
$ = cheerio.load(body);
$('.question-summary .question-hyperlink').each(function () {
console.info($(this).text());
});
})
}
parse('http://stackoverflow.com/');
此示例将在控制台上显示SO主页上显示的所有热门问题.这就是我喜欢Node.js及其社区的原因.它不可能比那更容易:-)
安装依赖项:
npm安装请求cheerio
并运行(假设上面的脚本在文件中crawler.js
):
node crawler.js
某些页面将具有特定编码的非英语内容,您需要将其解码为UTF-8
.例如,巴西葡萄牙语(或拉丁语的任何其他语言)的页面可能被编码ISO-8859-1
(也称为"latin1").当需要解码时,我告诉request
不要以任何方式解释内容,而是iconv-lite
用来做这项工作.
工作范例:
var
request = require('request'),
iconv = require('iconv-lite'),
cheerio = require('cheerio');
var
PAGE_ENCODING = 'utf-8'; // change to match page encoding
function parse(url) {
request({
url: url,
encoding: null // do not interpret content yet
}, function (error, response, body) {
var
$ = cheerio.load(iconv.decode(body, PAGE_ENCODING));
$('.question-summary .question-hyperlink').each(function () {
console.info($(this).text());
});
})
}
parse('http://stackoverflow.com/');
在运行之前,请安装依赖项:
npm安装请求iconv-lite cheerio
最后:
node crawler.js
下一步是关注链接.假设您要在SO上列出每个热门问题的所有海报.您必须先列出所有热门问题(例如上面的代码),然后输入每个链接,解析每个问题的页面以获取相关用户的列表.
当你开始关注链接时,可以开始回调地狱.为了避免这种情况,你应该使用某种承诺,期货或其他什么.我总是在我的工具带中保持异步.所以,这是一个使用async的爬虫的完整示例:
var
url = require('url'),
request = require('request'),
async = require('async'),
cheerio = require('cheerio');
var
baseUrl = 'http://stackoverflow.com/';
// Gets a page and returns a callback with a $ object
function getPage(url, parseFn) {
request({
url: url
}, function (error, response, body) {
parseFn(cheerio.load(body))
});
}
getPage(baseUrl, function ($) {
var
questions;
// Get list of questions
questions = $('.question-summary .question-hyperlink').map(function () {
return {
title: $(this).text(),
url: url.resolve(baseUrl, $(this).attr('href'))
};
}).get().slice(0, 5); // limit to the top 5 questions
// For each question
async.map(questions, function (question, questionDone) {
getPage(question.url, function ($$) {
// Get list of users
question.users = $$('.post-signature .user-details a').map(function () {
return $$(this).text();
}).get();
questionDone(null, question);
});
}, function (err, questionsWithPosters) {
// This function is called by async when all questions have been parsed
questionsWithPosters.forEach(function (question) {
// Prints each question along with its user list
console.info(question.title);
question.users.forEach(function (user) {
console.info('\t%s', user);
});
});
});
});
在运行之前:
npm安装请求async cheerio
运行测试:
node crawler.js
样本输出:
Is it possible to pause a Docker image build?
conradk
Thomasleveil
PHP Image Crop Issue
Elyor
Houston Molinar
Add two object in rails
user1670773
Makoto
max
Asymmetric encryption discrepancy - Android vs Java
Cookie Monster
Wand Maker
Objective-C: Adding 10 seconds to timer in SpriteKit
Christian K Rider
这是你应该知道开始制作自己的爬虫的基本知识:-)
请求
的iconv - 精简版
cheerio
异步
在2016年,事情变得更容易.使用您的控制台将jquery安装到node.js:
npm install jquery
将它绑定到$
node.js代码中的变量(例如 - 我习惯了):
var $ = require("jquery");
做东西:
$.ajax({ url: 'gimme_json.php', dataType: 'json', method: 'GET', data: { "now" : true } });
也适用于gulp,因为它基于node.js.
我相信现在的答案是肯定的.
https://github.com/tmpvar/jsdom
var navigator = { userAgent: "node-js" }; var jQuery = require("./node-jquery").jQueryInit(window, navigator);
npm install jquery --save
#note ALL LOWERCASE
npm install jsdom --save
const jsdom = require("jsdom"); const dom = new jsdom.JSDOM(``); var $ = require("jquery")(dom.window); $.getJSON('https://api.github.com/users/nhambayi',function(data) { console.log(data); });
可以使用以下命令安装jQuery模块:
npm install jquery
例:
var $ = require('jquery'); var http = require('http'); var options = { host: 'jquery.com', port: 80, path: '/' }; var html = ''; http.get(options, function(res) { res.on('data', function(data) { // collect the data chunks to the variable named "html" html += data; }).on('end', function() { // the whole of webpage data has been collected. parsing time! var title = $(html).find('title').text(); console.log(title); }); });
Node.js中jQuery的引用**:
http://quaintous.com/2015/07/31/jqery-node-mystery/
http://www.hacksparrow.com/jquery-with-node-js.html
您必须使用新的JSDOM API来获取窗口。
const jsdom = require("jsdom"); const { window } = new jsdom.JSDOM(`...`); var $ = require("jquery")(window);