JavaScript是一種廣泛使用的編程語言，常用于在網頁上進行交互和動態效果的實現。在使用JavaScript時，img.src是一個經常被用到的屬性，它可以控制HTML中的圖像，更換圖片的來源和大小。本文將通過舉例說明img.src在JavaScript中的應用。

首先，我們需要先了解img.src的結構：

在JavaScript中，我們可以通過以下代碼來更改img標簽中的src屬性：

document.getElementById("img1").src=新的圖片地址;

其中，“img1”是img標簽的id，新的圖片地址可以是本地文件路徑或網絡圖片地址。例如，如果我們有一個img標簽，它的src屬性包含了一張圖片：

我們可以通過以下代碼來更改它的圖片：

document.getElementById("myImg").src = "newPicture.jpg";

當我們運行這段代碼時，img標簽中的圖片將會被更換為“newPicture.jpg”。這個方法也可以用來實現鼠標懸停時更換圖片，例如：

function changeImage() {
var image = document.getElementById("myImage");
if (image.src.match("picture.jpg")) {
image.src = "newPicture.jpg";
} else {
image.src = "picture.jpg";
}
}

在這個例子中，我們使用onmouseover和onmouseout事件來監測鼠標的移動，當鼠標移動到圖片上時，圖片會更換為“newPicture.jpg”，當鼠標離開圖片時，圖片會恢復為原本的“picture.jpg”。

除了直接更換圖片，img.src在JavaScript中還可以用來預加載圖片。預加載圖片可以有效減少網站的等待時間，提高用戶體驗。例如：

function preloadImage(url) {
var img = new Image();
img.src = url;
}
preloadImage('picture1.jpg');
preloadImage('picture2.jpg');
preloadImage('picture3.jpg');

在這個例子中，我們定義了一個名為preloadImage的函數，它會預加載圖片“picture1.jpg”、“picture2.jpg”和“picture3.jpg”。當我們在需要使用這些圖片時，它們將更快地加載，不需要再等待圖片的下載。

總而言之，img.src在JavaScript中是一個十分重要的屬性，它可以控制網頁中的圖片，實現圖片的更換和預加載。希望本文的例子能幫助讀者更好地理解img.src的應用。