jquery before() after() 无法正常工作答案

【问题标题】：jquery before() after() are not working properlyjquery before() after() 无法正常工作
【发布时间】：2017-04-27 12:35:40
【问题描述】：

实际上我正在尝试在 ul 之前插入这些 (<div class="error_msg_div"><div class="error_msgicon_div"><span class="sprite_16x16_group_errorinfo fl rmar5"></span></div><div class="error_msgtext_div">) 东西

在 ul 之后插入这些 (</div><div class="error_msgcloseicon_div"><span class="sprite_16x16_group_blueclose_icon fl curpointer"></span></div><div class="clearfloat"></div></div>) 东西。

但在这里它插入了 div 标签，但它会自动关闭 div，但我不希望这样

因为我试图将 ul 推到一个 div 内。这不会发生在这里

我的 jsfiddle is here
这是我的脚本：

if($('span.error_span:has(ul.validation-messages)')){
                $('ul.validation-messages').before('<div class="error_msg_div"><div class="error_msgicon_div"><span class="sprite_16x16_group_errorinfo fl rmar5"></span></div><div class="error_msgtext_div">');
                $('ul.validation-messages').after('</div><div class="error_msgcloseicon_div"><span class="sprite_16x16_group_blueclose_icon fl curpointer"></span></div><div class="clearfloat"></div></div>');
            }

【问题讨论】：

你需要在前后插入有效的结束标签...看看.wrap()方法将你的内容包装在内容中

标签： javascript jquery dom-manipulation

【解决方案1】：

请注意，您正在使用这些函数操作 DOM，而不仅仅是连接一些包含 HTML 的字符串。您不能附加 </div>。

您应该使用 wrap() 在列表周围添加该 div，然后使用 before() 和 after() 插入其他 div。

$('ul.validation-messages')
    .wrap('<div class="error_msg_div">')
    .before('<div class="error_msgicon_div"><span class="sprite_16x16_group_errorinfo fl rmar5"></span></div><div class="error_msgtext_div">')
    .after('<div class="error_msgcloseicon_div"><span class="sprite_16x16_group_blueclose_icon fl curpointer"></span></div><div class="clearfloat"></div></div>');

【讨论】：

【解决方案2】：

您是否尝试过使用wrap 代替before 和after？

【讨论】：