javascript - 使用 `JQuery.remove()` 后如何重新打开某些东西？

Question

我为我的应用程序使用了一个免费模板，这个模板有一个按钮可以“隐藏”列表，如下所示:

小 x 按钮

执行的代码如下:

$(document).on('click', '.close-link', function () {
   var $BOX_PANEL = $(this).closest('.x_panel');
   $BOX_PANEL.remove();
});

现在我正在尝试添加一个按钮来重新打开此列表，但我遇到了困难，我找不到这样做的方法。我检查了 JQuery remove() 的文档并且没有 JQuery open()...

你有什么想法吗？

[编辑] 也许 HTML 会很棒:

<div class="col-md-6 col-sm-12 col-xs-12">
    <div class="x_panel">
        <div class="x_title">
            <h2>Machines</h2>
               <ul class="nav navbar-right panel_toolbox">
                  <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a></li>
                  <li class="dropdwon">
                     <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
                     <ul class="dropdown-menu" role="menu"></ul>
                  </li>
                  {{#if isNotHome}}<li><a class="backLocalHostDocker"><i class="fa fa-home"></i></a></li>{{/if}}
                  <li><a class="close-link" id="closeList"><i class="fa fa-close"></i></a></li>
              </ul>
           <div class="clearfix"></div>
         </div>
         <div class="x_content">
             <br />
             <ul class="container"></ul>
         </div>
    </div>
</div>

我刚刚清理了代码以仅显示结构

Answer 1

在这种情况下，不要使用 remove() 从 DOM 中删除元素。

就用

$BOX_PANEL.hide();

然后每当你想展示它时，使用

$BOX_PANEL.show();