为什么我的JQuery .after（）在元素之前插入代码？

Question

我明白了：

               $('input[name=whatWeLove1]').before('<ul><li>');
               $('input[name=whatWeLove1]').after('</li></ul>');

它会产生这个：

<ul>
    <li>
    </li>
</ul>
<input type="text" name="whatWeLove1" class="" maxlength="40">

为什么？

干杯， 斯蒂芬

Answer 1

因为jQuery会自动假设您不想只是插入开始标记并为您关闭元素。

您想使用.wrap();

  $('input[name=whatWeLove1]').wrap('<ul><li>');

Answer 2

JQuery操纵DOM，而不是HTML。这是一个微妙的区别，但它意味着它不会让你产生无效的HTML。运行第一行会生成不匹配的标记，直到您运行第二行，并且它不会让您这样做

您需要使用wrap函数，正如@NicolaPeluchetti所描述的那样。

Answer 3

这可能是因为你输入了破损的代码（在你修复它之前）...所以浏览器（或者可能是firebug或者可能是jquery）试图将它显示为格式正确/固定的。

实现您要做的事情的最佳方法是使用.wrap()

$('input[name=whatWeLove1]').wrap('<ul><li>');

Answer 4

我想你想要

$('input[name=whatWeLove1]').wrap('<ul>').wrap('<li >');

Answer 5

因为你在之前插入了元素：

 $('input[name=whatWeLove1]').before('<ul><li>');

这会自动关闭输入元素之前的元素，以防止标记错误。

您可以创建<ul><li>结构并在之后插入输入或直接wrap()输入。