如何使用PHP Simple HTML DOM獲取img src？

Question

我想從此頁面上抓取圖像http://www.ikea.com/us/en/catalog/products/S59163189/

用於顯示圖像的標記如下所示：

 <div id="moreImgThumbContainer">
    <div class="imageThumb" id="imageThumb_0">
        <a href="javascript:void(0);" id="imageThumbLink_0" class="active">
            <img src="/PIAimages/0386819_PE559167_S3.JPG" onclick="irwStatThumbImgClickedFromPIP();" onmouseover="addOpacityEffect(this.id);" onmouseout="rmvOpacityEffect(this.id);" id="imgID_0" style="opacity: 10;">
        </a> 
    </div>



 <div class="imageThumb" id="imageThumb_1">
        <a href="javascript:void(0);" id="imageThumbLink_1">
            <img src="/PIAimages/0449646_PE599007_S3.JPG" onclick="irwStatThumbImgClickedFromPIP();" onmouseover="addOpacityEffect(this.id);" onmouseout="rmvOpacityEffect(this.id);" id="imgID_1" style="opacity: 0.8;">
        </a>
    </div>
</div>

我嘗試在單個頁面中使用html代碼，它可以正常工作。

foreach($html->find('img[id^=imgID]') as $img_link){
         $img_array[] = 'http://www.ikea.com'.$img_link->src;
         $images = implode(';', $img_array); 
}

如何使用此API http://simplehtmldom.sourceforge.net/在PHP html dom解析器中獲取每個圖像的src ？

編輯：我認為我找到了問題的原因，圖像正在用ajax加載，並且需要時間加載。

有沒有辦法刮擦它們？

請幫忙！

Answer 1

嘗試使用jquery和Array#map函數

 var d = $('.imageThumb').map(function (){ c = $(this).children('a').children('img').attr('src'); return c; }).get() console.log(d.join(';')) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="moreImgThumbContainer"> <div class="imageThumb" id="imageThumb_0"> <a href="javascript:void(0);" id="imageThumbLink_0" class="active"> <img src="/PIAimages/0386819_PE559167_S3.JPG" onclick="irwStatThumbImgClickedFromPIP();" onmouseover="addOpacityEffect(this.id);" onmouseout="rmvOpacityEffect(this.id);" id="imgID_0" style="opacity: 10;"> </a> </div> <div class="imageThumb" id="imageThumb_1"> <a href="javascript:void(0);" id="imageThumbLink_1"> <img src="/PIAimages/0449646_PE599007_S3.JPG" onclick="irwStatThumbImgClickedFromPIP();" onmouseover="addOpacityEffect(this.id);" onmouseout="rmvOpacityEffect(this.id);" id="imgID_1" style="opacity: 0.8;"> </a> </div> </div> 

Answer 2

檢查此代碼。 我認為它將幫助您

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="moreImgThumbContainer">
<div class="imageThumb" id="imageThumb_0">
    <a href="javascript:void(0);" id="imageThumbLink_0" class="active">
        <img src="/PIAimages/0386819_PE559167_S3.JPG" onclick="irwStatThumbImgClickedFromPIP(this.id);" onmouseover="addOpacityEffect(this.id);" onmouseout="rmvOpacityEffect(this.id);" id="imgID_0" style="opacity: 10;">
    </a>
</div>

<div class="imageThumb" id="imageThumb_1">
    <a href="javascript:void(0);" id="imageThumbLink_1">
        <img src="/PIAimages/0449646_PE599007_S3.JPG" onclick="irwStatThumbImgClickedFromPIP(this.id);" onmouseover="addOpacityEffect(this.id);" onmouseout="rmvOpacityEffect(this.id);" id="imgID_1" style="opacity: 0.8;">
    </a>
</div>
</div>

這是jQuery

<script>

// get all image 

(function(){
var images = [];
$(".imageThumb img").each(function(){
  images.push($(this).attr('src'))
})
// console.log(images);
  console.log(images.join(';'))
  })()

function addOpacityEffect(id){
    var scr = $('#'+id).attr('src');
    alert(scr)
}

function rmvOpacityEffect(id){
     var scr = $('#'+id).attr('src');
    alert(scr)
}

 function irwStatThumbImgClickedFromPIP(id){
     var scr = $('#'+id).attr('src');
    alert(scr)
}


</script>