关于casperjs调换窗口,引用jquery和step栈!

首先,调换窗口用withPopup方法,调用了此方法后执行环境在这个step中暂时换到了新建的窗口,但是,在这个step执行结束,进行下一个step时,环境会自动转换到之前的环境中。代码实例如下:
对了,也可以直接用js语句对DOM进行操作,去掉target=”_blank”属性就可以了,这样也可以,但是并没有实现跳转窗口,而是让窗口不跳转,直接在元窗口上显示参考这篇文章用js操作DOM实现

网站:http://www.biqukan.com/
当然,withPopup方法的参数去看官方文档

var  casper = require("casper").create({
    pageSettings:{
        userAgent:"Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:60.0) Gecko/20100101 Firefox/60.0",
        loadImages: false
    }
});

phantom.outputEncoding = "gbk";
casper.start("http://www.biqukan.com/", function() {
    this.capture("D:/图片/首页.jpg");
    this.click("div.item:nth-child(1) > div:nth-child(1) > dl:nth-child(2) > dt:nth-child(1) > a:nth-child(2)");
    this.wait(10000);
    // z = typeof text;
    // 果然是string类型
});
casper.withPopup(/^http:\/\/www\.biqukan\.com\/\d_\d{3}/, function(){
    this.capture("D:/图片/元尊.jpg");
    // 在这个步骤中会跳转到新窗口的环境
    // 在下一个步骤中就自动返回原先的环境中了
});
casper.then(function(){
    this.capture("D:/图片/首页2.jpg");
});

casper.run(function(){
    this.exit();
});

引用jquery:其实casperjs可以引用任何的js库,引用官方文档的话是: you can use jQuery, as every single other javascript library on Earth.
在页面设置中使用clientStripts属性,注意属性值是你jquery库文件中的jquery.min.js文件地址。我的是:C:\Users\Administrator\node_modules\jquery\dist\jquery.min.js

使用实例如下:

var casper = require("casper").create({
    clientStripts:[
    "./node_modules/jquery/dist/jquery.js"
    ],
    // 经典之战,在casperjs中使用jquery
    // 其实,在casperjs中我们能够使用任何一种js库
    pageSettings:{
        loadImages:false,
        userAgent:"Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:60.0) Gecko/20100101 Firefox/60.0",
    }
});

phantom.outputEncoding = "gbk";

casper.start("http://www.biqukan.com/0_790/", function() {
    text = this.evaluate(function(){
        var array = $(".listmain>dl>dd>a").map(function(idex, ele){
            return this.textContent;
        });
        return array.toArray();
    });
});

casper.then(function(){
    this.echo(text);
});

casper.run(function(){
    this.exit();
});

还有一个就是step栈是怎么回事:先给个链接,看下step栈的解释
上面的例子能看懂就可以了,实质上,每打开一个链接(url),casperjs会自动在step栈中添加一个step,也就是start,open,thenOpen都会自动添加一个step。还有wait系列的方法也是添加一个step。我测试的代码如下:

// 一、
// then() basically adds a new navigation step in a stack.A step is a
// javascript function which can do two different things:

//     waiting for the previous step - if any - being executed
//     waiting for a requested url and related page to load
// 二、

// 显示一个step栈,可以通过这个栈来搞明白这个step栈是个什么样的执行顺序

//  require('utils').dump(casper.steps.map(function(step) {
//     return step.toString();
// }));

var casper = require("casper").create();

phantom.outputEncoding = "gbk";

casper.start("http://www.biqukan.com/", function(){
    this.echo("这是第一个步!");
});

casper.then(function(){
    this.echo("这是第二步!");
    this.wait(10000, function(){
        this.then(function(){
            this.echo("这是第三步!");
        });
    this.then(function(){
        this.echo("这是第四步");
    });
});
});

casper.thenOpen("http://www.biqukan.com/0_790/", function(){
    this.echo("这是第五步");
});


casper.then(function(){
    this.echo("这是第六步");
});

require('utils').dump(casper.steps.map(function(step) {
    return step.toString();
}));

console.log("这是测试同步的语句!");

casper.run(function(){
    this.exit();
});

补充说一下,node.js的异步在这里也是的。也就是说:
1、启动phantomjs
2、require(‘utils’).dump(casper.steps.map(function(step) {
return step.toString();
}));
3、console.log(“这是测试同步的语句!”);
以上三步是异步进行的,而在step栈中执行时同步的,只有每一个执行结束后才会进行下一步的执行!我的执行结果,参考一下:
关于casperjs调换窗口,引用jquery和step栈!_第1张图片

这方面有什么不懂的可以来问我!

你可能感兴趣的:(casperjs)