获取动态加载到页面中的图像
getting the images that load in a page dynamically
我想在加载facebook新闻源时获得它中的所有图像。我正在运行一个篡改的脚本。我遇到了一些问题:
- 最终的结果是包含在我排除的带有url的图像中(带有facebook静态url)
- 它只包括新闻提要中的一些图像,如果我向下滚动,它不会重新评估其输出。这可能是因为加载函数的原因,但我如何才能使其成为动态加载呢?我在哪里可以添加像.roll这样的功能
我使用jquery只在页面加载时运行函数。我应该做点别的吗?
以下是部分代码:
// ==UserScript==
// @name Accountability
// @namespace http://tampermonkey.net/
// @include https://www.facebook.com/*
// @include http*://*.facebook.com/*
// @exclude htt*://*static*.facebook.com*
// @version 0.1
// @description
// @author You
// @match http://tampermonkey.net/scripts.php
// @grant none
// @require http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js
// ==/UserScript==
/* jshint -W097 */
'use strict';
window.addEventListener('load', function() {
var all_images = document.evaluate('//img[@src]', document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
var newsfeed = document.evaluate('//*[contains(@id, topnews_main_stream_408239535924329)]', document, null,XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null);
var imgSrcs = [];
for (var i=0; i < all_images.snapshotLength; i++){
var this_image = all_images.snapshotItem(i);
var src = this_image.src;
if(src.indexOf('static') > -1){
continue;
}
if(src.indexOf('external') > -1){
continue;
}
imgSrcs.push(src);
console.log(this_image.src);
this_image.addEventListener("click", my_func, false);
}
for (var i=0; i < newsfeed.snapshotLength; i++){
var this_news = newsfeed.snapshotItem(i);
var src = this_news.src;
if(this_news.children.length>0){
}
if(Object.getOwnPropertyNames(this_news)[0]== '_startTime'){
var x = this_news.onreadystatechange();
}
this_news.addEventListener("click", my_func, false);
this_news.addEventListener("mouseover", my_func, false);
}
var my_func = function(){
console.log("the list", imgSrcs);
}
}, false);
您可以在所有img
标签上绑定load
,如
$("img").on("load", function() {
console.log($(this)[0].src)
});
如果你真的想用纯javascript来模仿on
,你可以参考EmulatejQuery"关于";带有纯javascript 中的选择器
相关文章:
- 使用JavaScript根据窗口/视口的高度动态调整图像大小
- 动态更改'汉堡包'导航取决于BG图像
- 是否可以仅通过jQuery将图像替换为用户动态选择的另一个图像
- 可在多个相册文件夹中查找的动态图像库
- 使用jquery垂直对齐动态加载的图像
- 根据容器 DIV 中的图像动态调整容器 DIV 的大小
- 如何将任意数量的图像动态添加到源字符串位于数据库中的 Web 窗体
- 将图像动态添加到照片滑动
- 使用 JavaScript 和构造函数的动态变量名称:使用 EaselJS 将图像动态克隆到多个画布
- 可以使用图像URL为图像动态添加替代文本
- 在没有画布的javascript中使用自定义光标图像动态更改光标大小
- CSS背景图像动态调整大小
- 将图像动态添加到HTML字符串中
- 使用javascript将图像动态写入iframe
- 根据背景图像动态调整文本颜色
- 根据图像动态设置画布的宽度和高度
- 在html中将图像动态添加到滑块中
- 将不同尺寸的并排图像动态调整为相同高度
- 将图像动态加载到 jQuery iViewer 中
- 如何使用javascript将图像动态地放在锚标记中