的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'); 

您也可以使用theImage = cell.querySelector('img')，如果你不需要支持IE8及以下（见这里https://developer.mozilla.org/en-US/docs/Web/API/document.querySelector#Browser_Compatibility）。

Answer 2

您可以搜索表格单元格内的图像元素，只需更改.src属性即可。

var cell = rows[lastRowClicked].cells[0]; 
cell.querySelector('img').src = 'some/other/image.jpg';