jquery - css 完全删除而不仅仅是可见性 :hidden

Question

这个问题很简单。
我有一个切换 div 元素的按钮:

var status = false;
$("#tab").click(function () {
    if (status != true) {
        $(".container2").css({ "visibility": "visible" });
        status = true;
    } else {
        $(".container2").removeAttr('style');
        status = false;
    }
});

问题是，当它被隐藏时，它会占用“不可见”空间，因此页面上的其余元素看起来放错了位置。

有没有办法可以完全删除我的 <div>我的 DOM 中的元素，这样它就不会占用空间，就像我做的那样:

visibility:hidden

在这种情况下，我将如何使用 jQuery .detach() 函数？我可以让它消失，但我不能再把它带回来。

Answer 1

像下面这样使用 remove() 函数从 DOM 中删除一个元素。

$(".container2").remove();

更新 如果您不想删除，请使用hide() 和show() 函数。

$(".container2").hide(); //to hide
$(".container2").show();  //to show

您还可以使用 toggle() 函数切换可见性。

$("#tab").click(function () {
    $(".container2").toggle();
});