CasperJs是一个基于PhantomJs的工具,其比起PhantomJs能够更加方便的进行navigation。
一个最简单的CasperJs代码
创建一个文件baidu.js。用来模拟我们訪问百度页面
var casper = require('casper').create(); casper.start('http://www.baidu.com/', function() { this.echo(this.getTitle()); }); casper.run();
执行:
casperjs baidu.js
得到输出:
“百度一下,你就知道”
一个第二简单的CasperJs代码
CasperJs的运行脚本是由一个一个的Step串联起来的。start表示第一步。然后后面的step用then来表示,再依次运行:
var casper = require('casper').create(); casper.start('http://www.baidu.com/', function() { this.echo(this.getTitle()); }); casper.then(function() { this.capture('baidu-homepage.png'); }) casper.run();
完毕以后。我们会在Console上得到一个title,同一时候我们也会得到在then中捕捉到的图片baidu-homepage.jpg
一个第三简单的CasperJs代码
我们想办法让CasperJs完毕搜索功能:
var casper = require('casper').create(); casper.start('http://www.baidu.com/', function() { this.echo(this.getTitle()); }); casper.then(function() { this.capture('baidu-homepage.png'); }); casper.then(function() { this.fill('form[action="/s"]', { wd: 'thoughtworks' }, true);//填入form。进行搜索 }); casper.then(function() { this.capture('thoughtworks-search-results.png'); }); casper.run();
得到的thoughtworks-search-results.png:
怎么引入jQuery
有些时候,还是jQuery来得方便
var casper = require('casper').create({ clientScripts: ["jquery.js"] }); casper.start('http://www.baidu.com/', function() { this.echo(this.getTitle()); }); casper.then(function() { this.fill('form[action="/s"]', { wd: 'thoughtworks' }, true); }); casper.then(function() { search_result_titles = this.evaluate(getTitles) this.echo(search_result_titles.join('\n')) }); function getTitles() { var titles = $.map($("h3.t a"), function(link) { return $(link).text() }); return titles } casper.run();
返回结果:
thoughtworks_百度百科 成都Thoughtworks-招聘专员--地点:成都招聘信息|ThoughtWorks招聘... 敏捷开发和体验设计 | ThoughtWorks thoughtworks基本情况及待遇 【懦夫救星_职场古拳法】 和Thoughtworks的一次邂逅(一) - redhat - ITeye技术站点 thoughtworks笔试整理zz_ThoughtWorks招聘经验 关于我们 | ThoughtWorks ThoughtWorks位列面试难度最高的科技公司之首_百度文库 透明的相冊-ThoughtWorks西安办公室 思特沃克软件技术(西安)有限公司ThoughtWorks Software ...
须要注意的地方:
1)create casper的时候,我们inject了jquery。这个jquery必须是保存在本地的,通过HTTP訪问是无效的。
2)this.evaluate(getTitles)能够理解成。我们在CasperJs中,将getTitles这种方法注入到了訪问的页面中。在訪问的页面中运行这种方法并反问其返回值。
3)訪问页面log的获取:2)中讲到了getTitles事实上是在被訪问页面中运行的,假设我们在getTitles增加一段console.log的代码话,怎么可以得到被訪问页面的console信息呢?
casper.then(function() { this.page.onConsoleMessage = function(e) { console.log(e); } search_result_titles = this.evaluate(getTitles) this.echo(search_result_titles.join('\n')) })
这样就能够侦听被訪问页面的console.log事件,比导出到CasperJs中
參考:http://docs.casperjs.org/en/latest/faq.html#can-i-use-jquery-with-casperjs
转载于:https://www.cnblogs.com/bhlsheji/p/5087166.html
相关资源:casperjs网页截屏例子