Javascript更改图像源

Question

我在表格单元格内有一个图像，它也是带有以下标记的可点击链接:

<a class="modalInput" rel="#flagsSummary" style="cursor:pointer">
    <img src="/FatcaOne_0/static/images/circleRed.png" width="20" height="20">
</a>

我对 Javascript 的语法感到困惑，我需要使用它来更改图像的源或图像本身，并保持元素及其属性不变。我尝试了这个，但这也改变了我不想要的链接:

rows[lastRowClicked].cells[0].innerHTML = '<a class="modalInput" rel="#flagsSummary" style="cursor:pointer"><img src="/FatcaOne_0/static/images/circleYellow.png" width="20" height="20"></a>';

我只想更改单击的最后一行中的图像。

Answer 1

尝试这样的事情:

var cell = rows[lastRowClicked].cells[0];
var allImagesInCell = cell.getElementsByTagName('img');
var theImage = allImagesInCell[0];

theImage.setAttribute('src', '/some/new/value');

如果您不需要支持 IE8 及更低版本，也可以使用 theImage = cell.querySelector('img')(参见此处 https://developer.mozilla.org/en-US/docs/Web/API/document.querySelector#Browser_Compatibility )。