更改JS中img標簽內元素的值

Question

我有一個這樣的HTML片段來顯示產品圖片：

<img src="/some/path" border="0" id="bigImg"  data-zoom-image="/some/path">

代碼data-zoom-image是指向較大圖像的路徑，因此將鼠標懸停在上面時，可以放大圖像。

我還有一個JavaScript函數，當我在其他地方單擊時，它會更改圖片...像這樣：

function showLarge(path)
{
 var full_path = 'upload/product_image/large_'+path;
  document.getElementById("bigImg").src = full_path;
  document.getElementById("bigImg").data-zoom-image = full_path;
}

我還想在圖像的SRC更改時更改data-zoom-image的值...我嘗試通過添加行document.getElementById("bigImg").data-zoom-image = full_path; 但這不起作用...我應該怎么做...

謝謝

Answer 1

您可以使用setAttribute更改指定元素上現有屬性的值。

document.getElementById("bigImg").setAttribute('data-zoom-image',full_path);

該文件在這里：

https://developer.mozilla.org/en-US/docs/Web/API/Element.setAttribute