js如何動(dòng)態(tài)設(shè)置img的src屬性

js
小億
1178
2023-08-04 09:34:18

在JavaScript中，可以通過(guò)設(shè)置img元素的src屬性來(lái)動(dòng)態(tài)改變圖片的來(lái)源。
以下是通過(guò)JavaScript動(dòng)態(tài)設(shè)置img元素的src屬性的示例：
HTML代碼：
```html
圖片
Change Image
```
JavaScript代碼：
```javascript
function changeImage() {
var img = document.getElementById("myImage");
img.src = "newimage.jpg";
img.alt = "New Image";
}
```
在上面的示例中，首先通過(guò)getElementById方法獲取到id為"myImage"的img元素。然后，通過(guò)設(shè)置img的src屬性為"newimage.jpg"來(lái)改變圖片的來(lái)源。同時(shí)，也可以使用img元素的alt屬性來(lái)動(dòng)態(tài)改變圖片的替代文本。
通過(guò)在按鈕的onclick事件中調(diào)用changeImage函數(shù)，點(diǎn)擊按鈕時(shí)會(huì)執(zhí)行changeImage函數(shù)，從而動(dòng)態(tài)改變img元素的src屬性。
請(qǐng)注意，在實(shí)際使用中，需要根據(jù)實(shí)際情況修改圖片的名稱和路徑。

0 踩