javascript在div没有内容时隐藏该div

由于客户端请求，我无法使用jquery。我使用下面的脚本检查div是否为空，如果为空则隐藏它。但不起作用。有什么想法吗

<style>     
#top
{
padding: 0;
height: 120px;
width: 820px;
float: left;
background: #cccccc;
}
</style>
        <script>
if( document.getElementById("top").innerHTML == "" )
{
   document.getElementById("top").style.display='none';
}
        </script>
        <div id="top">
        </div>

将脚本移动到div之后

---

似乎您已将结束div标记移动到与开始div标记相同的行。这是你问题的一部分

---

请尝试将空字符串与===运算符进行比较，这将为您节省一些麻烦。

如果div为null，则应在比较之前修剪div的内容。检查此代码

<script type="text/javascript">
if(document.getElementById("top").innerHTML.trim()=='')
{
   alert('hello');
   document.getElementById("top").style.display='none';
}
</script>

---

它应该可以工作。请尝试一下。

，并可能消除冗余查找？或将其放在窗口中。onload=function{}；。将脚本保持在与这里的技巧相同的行中，因为新行计为字符，而不是脚本的位置。您可以创建JSFIDLE测试用例吗？它应该可以工作..div内容是否会动态更改？@Nelson:不像显示的那样，它不应该。您的浏览器有内置调试器。如果您查看调试器，您将看到一个错误，告诉您出了什么问题。非常感谢您的帮助。在脚本隐藏代码之前，是否有任何方法可以阻止代码在瞬间显示？嗨！对不起，我没听懂你的话。你能详细说明你的问题吗？因为脚本在div之后，你会在脚本隐藏它之前的一瞬间看到带彩色背景的空div。谢谢

if (typeof (String.prototype.trim) === "undefined") {
    String.prototype.trim = function () {
        return String(this).replace(/^\s+|\s+$/g, '');
    };
}

$top = document.getElementById("top");
if ($top.innerHTML.trim() == "") {
    $top.style.display = 'none';
}

<script type="text/javascript">
if(document.getElementById("top").innerHTML.trim()=='')
{
   alert('hello');
   document.getElementById("top").style.display='none';
}
</script>