如何使用javascript将图像动态地放在锚标记中

How to put image in anchor tag dynamically using javascript

本文关键字：javascript 何使用 图像 动态      更新时间：2023-09-26

我在javascript中动态创建了图像。我想将 img 放置在锚标签中，我该怎么做？

        var element = document.createElement("img");
        element = cell.appendChild(element);
        element.setAttribute("src", "/Images/Delete.gif");

var anchor=document.createElement('a');
anchor.href='#';
var element = document.createElement("img");
element.setAttribute("src", "/Images/Delete.gif");
anchor.appendChild(element);
cell.appendChild(anchor);

我没有测试代码，我用我的大脑作为解释器，所以可能有错误。 但我认为你应该明白这个概念。

您需要对锚标记（节点）的引用。假设这是a.由于A和IMG是非常简单的html元素，因此可以正常工作：

a.innerHTML += '<img src="/Images/Delete.gif">';

或者，如果您想替换 A 标签的内容（而不是添加 img），只需删除+：

a.innerHTML = '<img src="/Images/Delete.gif">';

不能失败。在任何浏览器中。jQuery对于这么简单的东西来说是矫枉过正的（并且在下面会做完全相同的事情）。

编辑
但看起来您正在将img插入cell而不是锚标签中......或者您的锚标签称为cell？在这种情况下，只需将a.替换为 cell. =）

element.setAttribute 之前，请将其附加到我假设的单元格中......或者不分配元素 = cell.append.。

var element = document.createElement("img");
element.setAttribute("src", "/Images/Delete.gif");
cell.appendChild(element);

我的建议是：

function insertImage(anchorID, imagesrc){
  var img = "<img src='" + imagesrc + "' alt='image' />";
  $("#"+anchorID).html($("#"+anchorID).html() + img);
}

我正在 html 中添加 html，以防您仍然想保留其中的任何文本......否则否定 html 的第二条语句

你需要jQuery javascript插件才能工作 http://docs.jquery.com/Downloading_jQuery。

如果您不想包含插件，那么：

function insertImage(anchorID, imagesrc){
      var img = "<img src='" + imagesrc + "' alt='image' />";
      document.getElementById(anchorID).innerHtml = img;
    }
相关文章：