Görüntüyü Sc yoluyla özel Div ile indirin

Question

Her biri için tek bir görüntü indirmem gereken bir dizi URL'im var. Bu sayfaların her biri için biçimlendirme olarak

Ben ideal ürün kahraman bir sınıf ile div içinde görüntü indirmek veya görüntü src etiketi kaydetmek gerekir aşağıdaki

<div class="subcolumns product-hero"> 
     <div class="c60l"> 
       <img src="Cubes.png" width="300"/> 
     </div> 
</div> 

yoktur.

Bu, bir tür otomatik komut dosyası aracılığıyla mümkün mü? Düğüm/Perl vb?

Answer 1

Saf javascript'te web sayfalarını yüklemenizi ve sorgulamanızı sağlayan Phantom.js kullanmayı düşünürüm (tarayıcı gerekmez).

dokümana erişmek için nasıl Phantom's DOM Manipulation göz at ve sonra dom sorguları (örneğin getElementsByClassName ve getElementsByTagName gibi) ihtiyacınız görüntüleri erişmek için JavaScript vanilyayı kullanabilirsiniz. Yani komut dosyası aşağıdaki gibi görünebilir:

argüman listesi olarak URL listesi göz önüne alındığında

var page = require('webpage').create(); 
console.log('The default user agent is ' + page.settings.userAgent); 
page.settings.userAgent = 'SpecialAgent'; 
page.open('http://www.httpuseragent.org', function (status) { 
    if (status !== 'success') { 
     console.log('Unable to access network'); 
    } else { 
     page.evaluate(function() { 
      var productHeros = document.getElementsByClassName('product-hero'); 
      for (var i = 0; i < productHeros.length; i++) { 
       var productHeroDiv = productHeros[i]; 
       var image = productHeroDiv.getElementsByTagName("img")[0]; 
       var source = image.src; 
      } 
     }); 
     console.log(ua); 
    } 
    phantom.exit(); 
}); 

Answer 2

:

#!/bin/bash 
for url in "$@"; do 
    img_src=$(curl -s "$url" | \ 
     xmllint 2>/dev/null --recover --html --xpath \ 
     'string(//div[contains(@class, 'product-hero')]/img/@src)' -) 
    curl -O "$(dirname "$url")/$img_src" 
done