使用带有锚点的before（）和after（）

Question

我有一个img

<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无效的原因。

你想要的是wrap你的元素：

$('#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"/>');