Javascript如何改变HTML

Question

我有这个 HTML 项目。

<div class="inner" id="durum260" style="display: block;"><img src="/Content/plugins/images/teslim_edildi.png"></div>

此功能有效。

$('#durum260').hide();
$('#durum260').show();

如何用JS更改底部代码？

<img src="/Content/plugins/images/teslim_edildi.png"></div>

到

<img src="/Content/plugins/images/new_image.png"></div>

Answer 1

const img = document.querySelector('#durum260 > img');
img.src = img.src.replace('teslim_edildi', 'new_image');

Answer 2

document.getElementById('drum260').firstChild.src = "/Content/plugins/images/new_image.png";

Answer 3

虽然其他答案已经正确指定了在您的特定代码示例中更改图像的 src 属性的方法，但我建议向图像元素添加一个 id 属性并使用document.getElementById()。

如果您的 DOM 树发生变化，这将保护您。例如，如果您将另一张图片添加到 <div>，您要更改其 src 属性的图片可能不再是第一张图片，因此您最终会更改 src在错误的一个。

同样，如果您将任何其他 HTML 元素添加到图像之前的 <div>，它将不再是第一个 child。

Javascript How Can Change HTML