使用JavaScript來復制圖片大小非常簡單，只需要通過JavaScript代碼獲取圖片的寬度和高度，然后將其應用到目標圖片即可。本文將通過舉例說明來詳細介紹如何使用JavaScript復制圖片大小。 首先，讓我們來看一個簡單的例子。假設有一個圖片標簽，如下所示：

<img id="myImg" src="example.jpg">

要復制該圖片的大小，只需要使用如下代碼：

var myImg = document.getElementById("myImg");
var width = myImg.clientWidth;
var height = myImg.clientHeight;
console.log("Width: " + width + ", Height: " + height);

這段代碼將會把圖片的寬度和高度輸出到控制臺。注意，這里使用的是clientWidth和clientHeight屬性而不是width和height屬性。這是因為width和height屬性將給出實際大小，而clientWidth和clientHeight屬性將返回相對大小。 第二個例子是一個更實用的例子，假設我們有一個列表，其中包含多個圖片。我們要復制所有這些圖片的大小，并將它們應用到相同的CSS類中，以使它們具有相同的大小。這可以通過下面的代碼來實現：

var images = document.querySelectorAll("li img");
var width = images[0].clientWidth;
var height = images[0].clientHeight;
for (var i = 0; i< images.length; i++) {
images[i].classList.add("myClass");
images[i].style.width = width + "px";
images[i].style.height = height + "px";
}

注意，在這個例子中，我們使用了querySelectorAll方法來選擇所有的img元素。我們還給所有的img元素添加了myClass類，并將所有圖片的大小設置為第一個圖片的大小。 第三個例子是一個比較高級的例子。假設我們有一個圖片上傳表單，我們想要在用戶選擇圖片后立即顯示該圖片的大小。這可以通過下面的代碼來實現：

var fileInput = document.getElementById("myFileInput");
fileInput.addEventListener("change", function() {
var file = fileInput.files[0];
var reader = new FileReader();
reader.onload = function(event) {
var img = new Image();
img.onload = function() {
var width = img.width;
var height = img.height;
console.log("Width: " + width + ", Height: " + height);
};
img.src = event.target.result;
};
reader.readAsDataURL(file);
});

在這個例子中，我們首先獲取file input元素，然后在change事件中讀取用戶選擇的文件。當文件被讀取后，我們創建一個元素，并使用它來獲取圖片的大小。最后，我們在控制臺中輸出圖片的大小。 在這篇文章中，我們介紹了如何使用JavaScript復制圖片大小，并用舉例的方式對其進行了詳細說明。這些例子涵蓋了各種情況，從單個圖片到多個圖片，甚至到上傳和讀取用戶選擇的圖片。希望這些例子可以幫助您在需要的場合使用JavaScript來復制圖片的大小。