为什么有些图像的高度/宽度未定义？

Question

我目前正在尝试抓取网站的图像大小。我正在使用一个名为 scraperjs 的模块，它通常对我有帮助。现在我正在获取所有图像及其属性，但由于其中一些没有指定的高度/宽度，因此返回值是“未定义”。如果他们有一个高度/宽度属性，它就像一个魅力。即使没有在属性中说明它们的测量值，我如何才能获得它们的高度/宽度。 在此先感谢，这是我的代码。

var scraperjs = require('scraperjs');
url = process.argv.slice(2)[0];

if (!url) {
console.log('Usage: node ImgSizeGetter.js <url>');
return;
}

/*
 Get all the Imagessizes in a page.
 */
scraperjs.StaticScraper
.create()
.onStatusCode(function (code) {
//console.log(code);
})
    .scrape(function ($) {
/*return all img tags from entered url*/
return $('img').map(function () {
    /*read the height and width attr of each img returned*/
    var height = $(this).attr('height'),
        width = $(this).attr('width'),
        size = height + "x" + width;
    console.log(size);
    /*return size for further handling*/
    return size;
}).get();
})
    .then(function (images) {
/*do stuff*/
})
.get(url);

这是调用模块后我的节点命令提示符的粘贴：

node ImgSizeGetter.js https://reddit.com
70x70
52x70
70x70
62x70
36x70
70x70
52x70
69x70
70x70
69x70
70x70
59x70
69x70
52x70
70x70
52x70
39x70
52x70
67x70
39x70
70x70
52x70
68x70
39x70
undefinedxundefined

注意如果 undefinedxundefined 的最后一个尺寸，在查看 html 源代码后发现这是唯一没有设置高度/宽度属性的。

Answer 1

reddit 主页上的最后一个<img> 标记没有明确具有任何高度或宽度属性。这是一个一像素一像素的透明图像。

$().attr() 所做的是寻找实际设置的属性而不是属性。属性是实际写入 HTML 文件的内容，属性是属性和浏览器默认值的混合。属性可以随时间变化（例如通过脚本），而属性保持不变。

如果你想获取图片的实际高度和宽度，请使用 jQueries $().prop("height") 和 $().prop("width") 函数。

在您的代码中如下所示：

return $('img').map(function () {
    /*read the height and width prop of each img returned*/
    var height = $(this).prop('height'),
        width = $(this).prop('width'),
        size = height + "x" + width;
    console.log(size);
    /*return size for further handling*/
    return size;
}).get();

这将返回以下内容：

0: "70x70"
1: "52x70"
2: "70x70"
3: "70x70"
4: "70x70"
5: "62x70"
6: "36x70"
7: "52x70"
8: "69x70"
9: "70x70"
10: "52x70"
11: "69x70"
12: "70x70"
13: "39x70"
14: "70x70"
15: "67x70"
16: "69x70"
17: "52x70"
18: "70x70"
19: "39x70"
20: "52x70"
21: "39x70"
22: "70x70"
23: "52x70"
24: "1x1"