jQuery如何添加图片和链接？

Question

我需要将图片附加在 <a> 标签内。我一直在摸索，但是没有解决方法，让我发疯了。如果您能帮忙，那就太好了。我正在使用 jQuery 1.5。

while condition{
    $("<img>").attr("src", thumb).appendTo("#images");
}

最终结果应该是：

<a href="#"><img src="xxxxx"></a>

当我使用prepend或appendto时，我会得到以下结果：

<div id="images src="xxxxxxx"><a></a> 
OR
<a href="#"></a><img src="xxxxx">

感谢您的任何帮助。

- Zippy

---

尝试使用 $('<img src="' + thumb +'" />').appendTo('#images'); 替代。 - Alxandr

你在使用 while 循环做什么？ - XCS

可以看到完整的HTML。 - mcgrailm

.text() 怎么样？https://dev59.com/LXI-5IYBdhLWcg3w481P - rlb.usa

在它被操作之前，你的标记是什么样子的？ - David Thomas

Answer 1

$("#images").append($("<a>", 
{
    href: "#", 
    html: $("<img>", { src: thumb })
}));

示例代码：http://jsfiddle.net/hunter/Rxkxg/

此处为一个工作实例，点击链接跳转到示例代码页面。

- hunter

---

有趣的简写方式，我不知道你可以将对象作为第二个参数传递并填充它。 - Brad Christie

++ 我同意 @Brad 的观点。我之前完全不知道 :) - Sampson

你们两个的声望都这么高，却都不知道这个？我觉得很有趣。 - Levi Morrison

@Levi jQuery 的发展非常迅速。如果你不时停下来观察，就可能会错过它。 - hunter

这太棒了，谢谢。@Brad和你都给了我很好的见解。 - Zippy

Answer 2

$('<a>') // create anchor first
  .attr('href','#') // set anchor HREF attribute
  .append( // inside it, append an image
    $('<img>') // new image
      .attr('src',thumb) // set image SRC attribute
  ) // end append
  .appendTo('#images') // add to image body

差不多在正确的轨道上了...

演示

- Brad Christie

---

@Brad - 你不是应该像 $("<a/>") 和 $("<img/>") 那样关闭标签吗？还是说这只是可选的？ - Code Maverick

谢谢，我也喜欢 JS FIDDLE 这个网站。 - Zippy

@Scott：可选的，因为选择器只是查看它需要创建什么标签document.createElement。 @Tom：不客气。是的，jsFiddle是一个很棒的网站。;-) - Brad Christie

@Brad - 有趣。我在Stack Overflow上看到有人说这是必需的。我猜我本来可以自己测试的 =D - Code Maverick

@Tom 如果你喜欢 @Brads 的答案，那么让我告诉你，你可能会喜欢我的……或者不会。 - hunter

@Scott：如果您查看 jQuery源代码，就会在开头看到 rsingleTag = /^<(\w+)\s*\/?>(?:<\/\1>)?$/ 用于单标签生成，其中正则表达式无论如何都会排除 / 字符。 - Brad Christie