안녕하세요.
수강하다가 알려주신 v.parentElement.removeChild(v); 가 이미지 로드 시 잘 적용되지 않아서 다른 방법으로 개선했는데, 혹시 몰라 여기 공유해봅니다.
실제 사이트에서 알려주신 방법으로 직접 시도해보아도 이미지 로드가 안되고 있는데요. 아마 이후 unsplash 이미지 로드 방식이 바뀌거나 한 것 같습니다.따라서 이를 v.innerHTML=""; 로 바꿔서 imgEl 내부만 비워주는 방식으로 변경하니 스크롤 이벤트를 반복해서 주지 않아도 잘 구현됩니다.
혹시 안되시는 분 있으시면 참고되시길 바랍니당
while (result.length <= 30) {
const srcs = await page.evaluate(() => {
window.scrollTo(0, 0);
let imgs = [];
const imgEls = document.querySelectorAll(".ripi6");
if (imgEls.length) {
imgEls.forEach((v) => {
let src = v.querySelector("img.YVj9w")?.src; // element가 있으면 src 담는다.
src && imgs.push(src);
v.innerHTML = ""; // imgEl 내부만 비워주는 방식으로 변경
// v.parentElement.removeChild(v); // 동작 x, 실제 사이트에서 같은 방법으로 시도했을때 이미지 로드 불가
});
}
window.scrollBy(0, 100);
return imgs;
});
result = result.concat(srcs);
await page.waitForSelector(".ripi6");
console.log("새 이미지 태그 로드 완료");
}