问题是你试图访问一个超出范围的变量。
请给予这个试试：

<img id="cat-image" src="https://static.pexels.com/photos/104827/cat-pet-animal-domestic-104827.jpeg">
<img id="bird-image" src="http://animalia-life.club/data_images/bird/bird3.jpg">

<script>
var catImage = document.getElementById("cat-image");
var birdImage = document.getElementById("bird-image");
var catImageWidth;

catImage.onload = function() {
    catImageWidth = this.naturalWidth;
    birdImage.width = catImageWidth;
}

console.log(birdImage.width);
</script>

这是否意味着我只能在catImage.onload函数的作用域内分配birdImage.width？
似乎是这样，这是最好的办法。
您可以使用箭头函数，但不能使用this关键字来引用图像。

不工作：

catImage.onload = () => {
    catImageWidth = this.naturalWidth; //undefined
    console.log(catImageWidth)
}

因为在arrow函数中，this对象没有绑定到图像引用，它引用外部作用域的this。

有效：

catImage.onload = function() {
    catImageWidth = this.naturalWidth;
    console.log(catImageWidth) //logs 600
}

或：

catImage.onload = function() {
    catImageWidth = catImage.naturalWidth;
    console.log(catImageWidth) //logs 600
}

这也可以使用JQuery（请注意，我先保存元素引用（我正在使用一个维护此元素的JS类），然后我需要正确地获取onLoad函数中包含naturalWidth的对象：
DOM构建后获取引用：

this._imageElement = $(this._htmlElement).find("img.theImage:first");
$(this._imageElement).on('load', this._onImageLoaded.bind(this));

后者：

_onImageLoaded() {
   this._imageWidth = this._imageElement[0].naturalWidth;
   this._imageHeight = this._imageElement[0].naturalHeight;
}