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

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

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

Answer 2

尝试这样的事情：

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）。

Javascript更改图像源

2 个答案: