2016-12-30 15 views
2

私は画像srcを取得して戦っています。私が必要としたのは、特定のクラス名でイメージを取得し、それをコンソールにエコーすることです。私は別のコードメソッドは運を試してみました。助けていただければ幸いです。以下のHTMLコード。私は、クラス名の画像のみを取得したいcasperjsのクラスのimg srcを取得するには

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()); 
     }); 
    }); 
}); 

の下

<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コード:「クラス= 『製品イメージ写真』」。私がdocument.getElementByTagName( 'img');を使用した場合、それはサイト内のすべての画像を取得しますが、私が使用する場合は:document.getElementByClassName( 'product-image-photo');何も返されません。皆さんからお気軽にご連絡ください。

+0

は答えを更新し、それをテストしていないが、それは論理的に – Garfield

+0

ローズを動作するはずです、何かが確実にdocument.getElementsByClassNameで返されます。これは配列のようなオブジェクトを返します。 console.log(document.getElementsByClassName( 'product-image-photo'))を試してみてください。 ?ブラウザのコンソールにチェックインしてください。それはあなたのイメージを返しますか? –

答えて

0

これはあなたのコードより簡単です。

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

casper.waitFor(...)にget srcコードをラッピングする方が効率的です。

更新コード:

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'); 
}); 
+0

お勧めしましたがまだ動作していません.... dコンソールで何の結果も得られていません –

+0

あなたはどこから繋がっているのですか? – Garfield

+0

ありがとう、ありがとう、テストしていないが、ここに私がスクラップしたいウェブサイトのリンクがある:www.yudala.com –