用CasperJs自動瀏覽頁面
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
來自:http://blog.csdn.net/kiwi_coder/article/details/36248353