请考虑以下HTML:
<div aria-roledescription="carousel" data-disliderguid="slider772" class="di-slider slider772-slider gmus-1800x760-slider">
<div class="swiper-container">
<div class="swiper-wrapper">
<div
class="di-slide swiper-slide"
data-guid="slide2221"
data-screen="desktop"
data-title="995_2024_All_Hummer_Evergreen_2024_DWC"
data-id="2221"
data-filtervalue=""
data-swiper-autoplay="3000">
<div class="di-slider-disclaimer">
<button class="di-slider-disclaimer-toggle" aria-expanded="false">
<span class="inactive-label">Important Information</span>
<span class="active-label">Hide Information</span>
</button>
<div class="di-slider-disclaimer-container">
<div class="di-slider-disclaimer-contents">
Preproduction and simulated models shown throughout. Actual production model may vary. HUMMER EV is available from a GMC EV dealer.
</div>
</div>
</div>
<a class="di-slider-link"
aria-hidden="true"
href="/new-vehicles/?_dFR%5Byear%5D%5B0%5D=2024&_dFR%5Bmake%5D%5B0%5D=GMC&_dFR%5Bmodel%5D%5B0%5D=HUMMER+EV&_dFR%5Bmodel%5D%5B1%5D=HUMMER+EV+SUV&_dFR%5Bmodel%5D%5B2%5D=HUMMER+EV+Pickup"
title=""
tabindex="-1"
>
<picture class="slide-image">
<source media="(max-width: 767px)" srcset="https://gtmassets.dealerinspire.com/9061-995_2024_All_Hummer_Evergreen_2024_DWC_600x400.jpg">
<source media="(min-width: 768px)"
srcset="https://gtmassets.dealerinspire.com/9061-995_2024_All_Hummer_Evergreen_2024_DWC_1800x760.jpg">
<img src="https://gtmassets.dealerinspire.com/9061-995_2024_All_Hummer_Evergreen_2024_DWC_1800x760.jpg" alt="GMC HUMMER EV PICKUP AND SUV"
style=""
width="1800" height="760">
</picture>
</a>
</div>
<div
class="di-slide swiper-slide"
data-guid="slide950"
data-screen="desktop"
data-title="Generic"
data-id="950"
data-filtervalue=""
>
<picture class="slide-image">
<source media="(max-width: 767px)" srcset="https://di-uploads-development.dealerinspire.com/robertsonsgmc-winback0123/uploads/2023/03/Group-of-2023-GMC-Terrain-SUVs-parked-on-beach_mobile.jpg">
<source media="(min-width: 768px)"
srcset="https://di-uploads-development.dealerinspire.com/robertsonsgmc-winback0123/uploads/2023/03/Group-of-2023-GMC-Terrain-SUVs-parked-on-beach-1800x760.jpg">
<img src="https://di-uploads-development.dealerinspire.com/robertsonsgmc-winback0123/uploads/2023/03/Group-of-2023-GMC-Terrain-SUVs-parked-on-beach-1800x760.jpg" alt="Group of 2023 GMC Terrain SUVs parked on beach"
style="visibility:hidden"
width="1800" height="760">
</picture>
我正在try 使用Cherrio通过SCrapeNimpa返回Div类dilider的子级的所有图像的SRC,如HTML代码片段的第一行所示.所有图像都属于HTML图片对象,并且都有一个类似的div类.然而,我想要返回的唯一链接是值.
当我try 在他们的Sandbox 上运行以下代码时:https://scrapeninja.net/cheerio-sandbox/basic,我得到一个错误"Error:Expect Name,Found://gtmassets.dealerinspire.com/9061-995_2024_All_Hummer_Evergreen_2024_DWC_1800x760.jpg on Line 19"
下面是我收到的错误:
// define function which accepts body and cheerio as args
function extract(input, cheerio) {
// return object with extracted values
let $ = cheerio.load(input);
var listItems = $(".di-slider");
listItems.each(function(idx, picture) {
let image= $(picture).find('img').attr('src');
return {
source: $(image)
};
});
}
我承认,我在JS上并不是最棒的,我已经很多年没有使用jQuery了,这是我第一次try 使用cheiio或scrapeninca.
我在https://pixeljets.com/blog/cheerio-sandbox-cheatsheet/#iterate-over-children-and-return-them-as-an-array-of-objects岁时审阅了文档,并在How to get image url by cheerio?的基础上构建了我的函数
根据下面接受的答案,下面是完整的工作片段
function extract(input, cheerio) {
const $ = cheerio.load(input);
return [...$(".di-slider")].map(e => ({
sources: [...$(e).find("img")].map(e => $(e).attr("src"))
}));
}