javascript - HTML 连接 img 标签内的跨度

Question

我在 html 中有一个图像标记，它以前引用了 php 数组中的图像。我最近将其更新为一个 javascript 对象，因此我可以使用 AJAX 请求

<img src="http://www.example.com/images/<?php echo $arrayElement[item]; ?>.gif">

<script>
    document.getElementById('item').innerHTML = this.processingData['item'];
</script>

我试过:

<img src="http://www.example.com/images/<?php echo "<span id='item'></span>"; ?>.gif">

我想要的最终结果是:

<img src="http://www.example.com/images/[nameOfImage].gif">

Answer 1

据我所知，没有必要在其中放置 html 标签。您需要在其中回显的是纯粹而简单的图像名称

<img src="http://www.example.com/images/<?php echo $arrayElement[item]; ?>.gif">

是正确的。现在如果你需要影响 javascript 中的 src 属性，只需给它一个句柄(如果图像在它的页面中是唯一的，id 就可以)像这样

<img id="myImage" src="http://www.example.com/images/<?php echo $arrayElement[item]; ?>.gif">

然后在javascript中引用它

var img = document.getElementsById("myImage");
img.src = "anyValidImgUrl";

如果您从 ajax 查询中获取图像 url，请在您的 ajax 回调中使用上面的代码片段。如果您使用的是 jquery，则按如下方式链接图像 url

$(".myImage").attr("src","anyValidImgUrl");