如何在casperjs中获取class的img src

Question

我一直在为获取图片 src 而苦恼。我需要的是获取具有特定 class 名称的图像并在控制台上回显它。我尝试了不同的代码方法，但没有成功。请感谢您的帮助。 HTML 下面的代码。

<a href="http://www.yudala.com/tecno-w5-1gb-16gb-grey.html"  class="product photo product-item-photo" tabindex="-1">
    <span class="product-image-container em-alt-hover" style="width:205px;">
        <span class="product-image-wrapper" style="padding-bottom: 100%;">
            <img class="product-image-photo" src="http://www.yudala.com/pub/media/catalog/product/cache/1/thumbnail/280x280/beff4985b56e3afdbeabfc89641a4582/t/e/tecno_w5.jpg" alt="Tecno W5 | 1GB, 16GB | Grey + Free Alcatel 1050D Phone" width="205" height="205">
        </span>
    </span>
</a>

以下JS代码

casper.then(function getImages(){
    links = this.evaluate(function(){
        var links = document.getElementsByClassName('product-image-photo');
        links = Array.prototype.map.call(links,function(link){
            return link.getAttribute('src');
        });
        return links;
    });
});

casper.then(function(){
    this.echo(this.getCurrentUrl());
    this.each(links,function(self,link){
        self.thenOpen(link,function(src){
            this.echo(this.getCurrentUrl());
        });
    });
});

我只想获取 class 名称的图像：'class="product-image-photo"'。如果我使用 document.getElementByTagName('img');它获取网站中的所有图像，但如果我使用：document.getElementByClassName('product-image-photo');没有 returns。很高兴收到你们的来信。

Answer 1

这会比您的代码简单。

casper.evaluate(function(){
    if(document.querySelector('.product-image-photo')){
        return document.querySelector('.product-image-photo').src;
   }
});

将您的 get src 代码包装在 casper.waitFor(...) 中会更有效率。

更新代码：

casper.waitForSelector('ol.products li.product-item', function(){
    var links = this.evaluate(function(){
        var imgs = document.querySelectorAll('ol.products li.product-item .product-image-wrapper img');
        var links = [];
        for(var i=0; i<imgs.length; i++){
            links.push(imgs[i].src);
        }
        return links;
    });

    this.then(function(){
       this.each(links, function(){
           // further code here
       });
    });
}, function(){
    this.echo('No el. found');
});

如何在casperjs中获取class的img src

How to get img src of a class in casperjs

javascript

casperjs