javascript - 如何最小化一个 div 并隐藏包含的 div？

Question

所以目前，我在一个函数中使用了 jQuery，当单击某个切换按钮时，它会将 div 缩小到 20px。我也希望该 div 内的所有 div 都隐藏起来，但如果可能的话，我不想求助于递归函数/循环。目前，我的切换按钮可以正常工作，但是当我隐藏一个 div 时，它的所有子项(如果有的话)都保持在原来的位置。我可以简单地将高度强制为 20px 并使所有包含的 div 也消失吗？我需要的一个很好的例子就是在板上隐藏评论链(例如 reddit)。谢谢。

当然，代码:

function toggleComment(child)
{
    if (child.innerHTML.includes("–"))
    {
        //Minimizing
        child.innerHTML = "[+]";
        $(child).parent().addClass("minimized");
        hideChildren($(child).parent());
    }
    else
    {
        //Maximizing
        child.innerHTML = "[–]";
        $(child).parent().removeClass("minimized");
        showChildren($(child).parent());
    }
}

function hideChildren(parent)
{
    for (var i = 0; i < parent.children().length; i++)
    {
        var child = parent.children().eq(i);
        if (!child.hasClass('ignoreOnHide'))
        {
            parent.children().eq(i).hide();
        }            
        if (child.has("div"))
        {
            hideChildren(child);
        }
    }
}

function showChildren(parent)
{
    for (var i = 0; i < parent.children().length; i++)
    {
        var child = parent.children().eq(i);
        parent.children().eq(i).show();
    }
}

此代码部分有效。它在视觉上按预期运行，但出现了更复杂的问题。我不想使用递归函数和循环，因为它又不能完全按预期工作。确切的问题很难解释，与这个问题无关。有没有其他方法可以解决这个问题，最小化一个 div 并完全隐藏它的内容，没有循环等等？

Answer 1

尝试添加

溢出:隐藏；

到您的父 div 以隐藏位于其宽度/高度之外的元素。