jquery - 在锚点上使用 before() 和 after()

Question

我有一张图片

<img id="dynamic" src="www.google.com.br" />

如何使用 jquery 的 before() 和 after() 方法在该 img 中设置锚点？

像这样：

$('#dynamic').before('<a href="http://google.com">');
$('#dynamic').after('</a>');

但是......当我做这样的事情时，jquery会自动添加锚点的关闭标签

<a href="http://google.com"></a>
<img id="dynamic" src="www.google.com.br" />

有什么想法？

Answer 1

您不能附加元素的一部分。

$('#dynamic').before('<a href="http://google.com">');

生成一个完整的元素和

$('#dynamic').after('</a>');

生成整个元素（或根本不生成，取决于浏览器）。

使用.wrap方法。

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

Answer 2

jQuery DOM 添加函数，如append、before、after等，不会将 HTML 编辑为字符串，而是附加由元素组成的有效 DOM 片段。这就是为什么你不能只附加类似的东西</a>，这会使 DOM 无效。

你想要的是包装你的元素：

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

Answer 3

改用.wrap()：

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

Answer 4

尝试

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