Question

Javascript appendChild：未定义不是一个函数

2014-11-02

1139

javascript html

我试图将链接添加到我在一段 javascript 代码中的图像标签中，如下所示：

var imgs = document.getElementsByTagName("img");

但是我试图在循环中添加除第一个之外的每个源：

for (var i = 1; i < imgs.length; i++) {
    var a = document.createElement('a');
    a.href = imgs[i].src;
    a.appenChild(imgs[i]);
}

但是，当我运行此代码时，出现此错误：

Uncaught TypeError: undefined is not a function

我尝试使用 alert 显示 imgs[i] ，但得到 [object HTMLImageElement] 。可能是什么原因导致的，我该如何解决？提前谢谢大家

Answer 1

您需要 appendChild() ，但您的代码显示 appenChild() 。修正拼写错误，错误应该会得到解决。

Answer 2

appendChild 上的拼写错误以及使用 cloneNode 将阻止您的代码从页面中删除图像。

要用新链接替换图像，请使用以下代码。

var imgs = document.getElementsByTagName("img");

for (var i = 0; i < imgs.length; i++) {
    var a = document.createElement('a');
    a.href = imgs[i].src;
    a.appendChild(imgs[i].cloneNode(true));
    imgs[i].parentNode.replaceChild(a, imgs[i]);
}

编辑：

修改 HTML 将是更好的方法。

发件人：

<img src="link/to/image.jpg"></img>

收件人：

<a href="link/to/image.jpg"></a>
    <img src="link/to/image.jpg"></img>
</a>