如何隐藏div和div覆盖的地方答案

【问题标题】：How to hide the div and place coverd by div如何隐藏div和div覆盖的地方
【发布时间】：2023-03-04 22:31:01
【问题描述】：

Javascript：

$(document).ready(function () {
    $("#visualization").hide();
    $("#visualization1").hide();
});

HTML 代码：

<table>
    <tr>
        <td>
            <div id="visualization" style="width: 600px; height: 400px;" ></div>
        </td>
    </tr>
    <tr>
        <td>
            <div id="visualization1" style="width: 600px; height: 400px;"></div>
        </td>
    </tr>
</table>

在此代码中，我可以隐藏 div，但它显示 div 空间并尝试将其他内容（页面中）调整到该空间中。谁能帮我解决这个错误。

【问题讨论】：

标签： javascript jquery css

【解决方案1】：

您可以使用 .css() 将 div 的 visibility 状态设置为 hidden，而不是隐藏它：

$("#visualization").css('visibility','hidden');

来自MDN docs：

visibility 属性的 hidden 值会隐藏一个元素，但会在原处留出空间。

【讨论】：

【解决方案2】：

使用display:none

点赞：jQuery('#id').css("display","none");

$("#visualization").css('display','none');

也请阅读Difference between jQuery .hide() and .css("display", "none")..!!

或

document.getElementbyId("visualization").style.display='none';

【讨论】：

【解决方案3】：

你可以用visibility:hidden点赞

$("#visualization").css('visibility','hidden');

【讨论】：

【解决方案4】：

试试visibility

$("#visualization, #visualization1").css('visibility','hidden');

【讨论】：

【解决方案5】：

将visibility 属性设置为hidden：

 document.getElementById("visualization").style.visibility="hidden";
 document.getElementById("visualization1").style.visibility = "hidden";

JS 小提琴： http://jsfiddle.net/xU9Su/

【讨论】：

【解决方案6】：

你可以试试这个

这将替换该位置，但在可见性的情况下：隐藏的内容将处于隐藏模式，但该被占用的位置仍然是一个空白区域

<script type="text/javascript">
     $(document).ready(function () {
                     $("#visualization").css('display','none');
              $("#visualization1").css('display','none');

     });

</script>

【讨论】：