jquery not()函数不能处理所有元素

时间:2014-07-22 10:40:25

标签: javascript jquery html

我使用jquery不删除元素的html。 我没有得到jQuery not()以正确的方式工作。除了我提到的最后一个元素之外,它会删除子元素中的所有元素。

我的Html -

<body>
    <div id="edit-save-section">
        <button id="edit-button" class="btn btn-info btn-large">
            <span><i class="fa fa-cog"></i>&nbsp;EDIT</span>
        </button>
        <button class="division-twenty btn btn-success btn-large" data-loading-text="Saving..." class="btn btn-primary" id="btn_save"><span><i class="fa fa-save"></i>&nbsp;SAVE</span>
        </button>
    </div>

    <nav id="menu">
        <ul>
            <li><a href="javascript:;">Link1</a>
            </li>
            <li><a href="javascript:;">Link2</a>
            </li>
            <li><a href="javascript:;">Link3</a>
            </li>
            <li><a href="javascript:;">Link4</a>
            </li>
        </ul>
    </nav>

    <div class="removable-section">

        <a href="javascript:;" class=" pull-right span1 handle" rel="tooltip" title="Arrange section" data-placement="left"><b><i class="fa fa-arrows fa-2x"></i></b></a>
        <a class="span1 pull-right remove-section-action" rel="tooltip" title="Remove section" data-placement="left" href="javascript:;"><b><i class="fa fa-times fa-2x"></i></b></a>
    </div>

    <div id="allhtml"></div>
</body>

使用jQuery清除html -

 $('#btn_save').click(function () {
     var notAll = $('body').children().not("#menu", ".removable-section", "#edit-save-section").html();
     $('#allhtml').append(notAll);
     console.log($('#allhtml').html());
 });

不知何故,我设法删除了#menu.removable-section,但我无法移除#edit-save-section

如果我尝试改变这些部分的顺序,如 -

 var notAll = $('body').children().not("#menu","#edit-save-section",".removable-section").html();

然后它很奇怪。它不会从上面的html结构中找到的最后一个孩子从身体中删除。在这种情况下,它是.removable-section

让我知道我做错了什么?

1 个答案:

答案 0 :(得分:1)

您也可以使用JQuery Clone来实现此目标

$('#btn_save').click(function () {
     var notAll = $('body').clone(true);
     notAll.find("#menu").remove();
     notAll.find(".removable-section").remove();
     notAll.find("#edit-save-section").remove();
     $('#allhtml').append(notAll);

 });