关于jQuery的问题.append（）

Question

任何人都可以帮助我理解为什么这一行不会创建带有链接的图像：

var img = new Image();
$('#id').html('<a href="http://google.com">').append(img).append('</a>');

我正在设置img属性（src，alt ...等），我只是将这些行取出，因为它们不相关。不应该将DIV的HTML设置为HREF，然后是图像，然后关闭A标签？这对我不起作用，我是以错误的方式进行的吗？

Answer 1

这应该这样做：

$(img).appendTo('#id').wrap('<a href="http://google.com" />');

现场演示： http://jsfiddle.net/simevidas/A4HqE/1/

---

jQuery的html()会自动关闭HTML元素。见这里：http://jsfiddle.net/simevidas/Ut2pQ/

---

更好的解决方案：

$('<a href="http://google.com" />').append(img).appendTo('#id');

此解决方案更好，因为此处DOM仅被操作一次（当附加ANCHOR时）。在我上面的原始解决方案中，DOM被操作两次（1.附加了IMG，并且2. ANCHOR被包裹在图像周围）。

现场演示： http://jsfiddle.net/simevidas/A4HqE/2/

Answer 2

追加是一个棘手的标签，有时它没有做你期望的。

在许多情况下，它更容易使用appendTo并实际构建元素。

你必须附加某些内容......它不像字符串生成器。 尝试：

$('<a>').attr({'id': 'aId'  'href': '[path for link]'}).appendTo('#divId');
$('<img>').attr('src', '[path to image]').appendto('#aId');

如果您已经使用new Image()构建了图像，则可以使用ITS id作为选择器附加到锚点...可以附加到div。

Answer 3

.append将整个标记作为输入，而不是开始标记：

$('#id').html('<a href="http://google.com"></a>').append(img);

Answer 4

我会这样做：

$('#id').append($('<a>').attr('href', 'http://www.google.com').append(img));

当然，在任何事情都能正常工作之前，你必须为你的图像设置所有属性。