Question

我正在尝试获取“图类> img src”中每个图像的url。该网页包含一个列表列表，每个列表都有一个图像。

问题是图像url类在'class =“ lazyloaded”'（*名称前面的注记空间）和'class =“ is-higher-height lazyloaded”'之间切换。

我正在考虑沿着“延迟加载”或“ is-higher-height.lazyloaded”行进行查询。什么都行不通。

奇怪的是，我在沙盒上进行了测试，发现了两个项目。下方链接。

感谢任何帮助！谢谢。

html结构

<div class="items-box-content">

   <!-- each section represents a single listing --> 
   <section class="items-box">
      <a href="http:url">

         <figure class="items-box-photo">
            <img data-src="imageurl.jpg" class=" lazyloaded" src="imageurl.jpg">

            <!-- sometimes class=" is-higher-height lazyloaded" -->
         </figure>

      </a>
   </section>

   <!--  many other listings --> 
   <section></section>...

</div>

人偶主线


await page.evaluate(() => { 
  document.querySelector('section[class*="items-box"]');
});

let elements = await page.$$('section[class*="items-box"]');

let listImg    = await element.$eval('img.lazyloaded', img => img.getAttribute('src'));

下面尝试了$ eval，没有效果


//CSS versions
img.lazyloaded //captures 1 listing on debugger;
.lazyloaded                 
is-higher-height.lazyloaded //doesnt capture even 1
.is-higher-height.lazyloaded //doesnt capture even 1
img.lazyloaded.is-higher-height.lazyloaded //multiple classes

//XPath versions
'img[class*="lazyloaded"]'   // includes name 
'img.[class$="lazyloaded"]'  // ends with name 
'img.[class^="lazyloaded"]'  // starts with name 
'//img[class^="lazyloaded"]' //not valid selector

QuerySelector无法在Element上执行或找不到匹配的选择器

0 个答案: