jquery replaceWith 不使用 </div>

Question

我已经尝试了几个小时来解决这个问题，但运气不佳。我会先问我的具体问题，然后再给你一个更大的图景，以防我的整个方法都错了。

具体问题： 我正在尝试用一些结束标签替换列表项元素。下面的第一个 IF 语句有效，第二个适用于“html”变量中的许多值，但是只要我将一个结束 div 标记粘贴到变量中，替换就会失败。我想不通。我尝试用 1-2 个反斜杠转义结束标记中的斜杠，但这没有帮助（两个反斜杠会发生替换，但文本会呈现在页面上而不是代码上）。

$("li.class1").each(function() {
    var li = $(this);
    var span = li.find("span.class2").text();
    if (span.indexOf("<") == 0) {
        var text = $(this).text();
        text = text.substring(1, text.length);
        li.replaceWith('<li><div><ul><li class="Mheader">' + text + '</li>');
    }
    else if (span.indexOf(">") == 0) {
        var html = '</ul></div></li>';
        li.replaceWith(html);
        alert(html);
    }
});

现在，话虽如此.. 我注意到 FireBug 在第一次替换发生后会显示结束标签，即使我还没有插入它们。我希望这只是 FireBug 聪明并插入它们，因为它们丢失了。

我真正想要完成的工作： 我们有一个应用程序可以将一些简单的弹出式导航菜单呈现为一个大的、垂直的、无序列表。我想在这个列表中插入一些特殊格式的组名（如下所示），然后使用 jquery 替换那些特殊格式的组名，以有效地将这些“组”切入 DIV。然后，我将使用 CSS 水平布置每个组，以创建一些基本的大型菜单功能。下面的示例与我上面的源代码相关。

• 项目 1
• 项目 2
• >
• 项目 1
• 项目 2
• >

jquery 调整后所需的标记：

<ul>
<li>
    <div>
    <ul>
    <li class=header>header1</li>
    <li>item1</li>
    .....
    </ul></div>
</li>

感谢您的任何反馈。当我需要这样的信息时，这是我的首选网站，但这是我第一次问！

谢谢，

汤米

Answer 1

结束标签会自动插入。

您可以以某种方式使用 .wrapInner，或者执行以下操作：

html = '';
$("li").each(function() { // I removed the class as I don't know if each li has one or if only headers, etc.
    var li = $(this);
    var span = li.text(); // Same here.. removed the class
    if (span.indexOf("<") == 0) {
        var text = $(this).text();
        text = text.substring(1, text.length);
        html += '<li><div><ul><li class="Mheader">' + text + '</li>';
    }
    else if (span.indexOf(">") == 0) {
        html += '</ul></div></li>';
    } else {
        html += '<li>' + li.html() + '</li>';
    }
});
$('ul').html(html);