How to force loading images for the webpages installed “lazy load” without scrolling?

China☆狼群 提交于 2021-02-10 11:54:11

问题


I implement a Chrome extension. The extension needs to get all images URLs of webpages. However, some webpages have "lazy load" plug-in. My question is if it is possible that I can still get URLs without required manually scrolling down?


回答1:


Many of the lazy-load plugins stores the actual URL in the data-* section. When scrolling down, right before the image tag gets into view the data-* content is set on the src attribute to start loading the image.

You can iterate through all the image tags like this to find the links, for example:

var images = document.querySelectorAll("img"),
    links = [], i = 0, img;

while(img = images[i++]) 
    links.push(img.dataset.original || img.src);

But note that there is no naming standard for the data-* holder so different plugins will use different names - you'll have to collect these manually (f.ex. this plugin uses the name data-original, this one uses data-layzr and so on).

You could possible do an addition step looping through the dataset collection to find any string which may seem to contain an URL (if src is empty), but also this is prone to errors as images from the same server often are relative links and data-* can hold other data too.




回答2:


Looking at the source code you can trigger the 'appear' event event on all the images.

$('img').trigger('appear');

Would help if you would privde a jsfiddle to test on.



来源:https://stackoverflow.com/questions/30839469/how-to-force-loading-images-for-the-webpages-installed-lazy-load-without-scrol

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!