Javascript、URL解析、导航菜单上的条件CSS style.display

好吧，由于某种原因，我的代码在这里不起作用。。。它是一个垂直的HTML/CSS导航菜单，由

和

创建。。。。。每个列表项都有一个子导航，它将显示另一个列表。基本上，我想让代码读取当前URL并有条件地隐藏（

display:none

）不应用于指定URL的子导航

显然，我会为每个导航项重复这段代码

为什么当我要求元素ID显示：无时，它将不起作用。。。啊。请帮忙

请参阅附件。谢谢

    <script type="text/javascript">
    var URL = window.location.protocol + "://" + window.location.host + "/" + window.location.pathname;

    var pathArray = window.location.pathname.split('/');
    document.write(URL);
        document.write("<br/>");
    document.write(pathArray[1]);
        document.write("<br/>");
    document.write(pathArray[2]);
        document.write("<br/>");
    document.write(pathArray[3]);
        document.write("<br/>");
    if (pathArray[2] == "general")
     {
      document.getElementById("cd").style.display = 'none';
        document.getElementById("id").style.display = 'none';
          document.getElementById("sd").style.display = 'none';
         } 


</script>

    <!-- Left Navigation starts here -->
            <!-- if IE -->
            <div id="IE_nav">
            <!-- endif IE -->
            <div id="left_nav">
                <ul>
                    <a href="#"><li class="nav_button">NAV ITEM 1</li></a>
                                <li class="sub_nav_box" id="gd">
                                    <ul>
                                    <li><a href="#">Sub-Item 1</a></li>
                                    <li><a href="#">Sub-Item 2</a></li>
                                    </ul>
                                </li>
                    <a href="#"><li class="nav_button">NAV ITEM 2</li></a>
                                <li id="cd" class="sub_nav_box">        
                                    <ul>
                                    <li><a href="#">Sub-Item 1</a></li>
                                    <li><a href="#">Sub-Item 2</a></li>
                                    </ul>
                                </li>
                    <a href="#"><li class="nav_button">NAV ITEM 3</li></a>
                                <li class="sub_nav_box" id="id">
                                    <ul>
                                    <li><a href="#">Sub-Item 1</a></li>
                                    </ul></ul>
                            </div></div>

var URL=window.location.protocol+“：//”+window.location.host+“/”+window.location.pathname；
var pathArray=window.location.pathname.split（'/'）；
document.write（URL）；
文件。写（“
”）；
document.write（路径数组[1]）；
文件。写（“
”）；
document.write（路径数组[2]）；
文件。写（“
”）；
document.write（路径数组[3]）；
文件。写（“
”）；
if（路径阵列[2]=“常规”）
{
document.getElementById（“cd”）.style.display='none'；
document.getElementById（“id”）.style.display='none'；
document.getElementById（“sd”）.style.display='none'；
} 

也就是说，您试图在定义某些DOM元素之前访问它们

将脚本移动到html之后，它就会工作

<!-- Left Navigation starts here -->
......

---

问题在于，请求JavaScript对其执行操作的DOM在执行时未加载。我建议放置所有JS代码：

<script type="text/javascript">
window.onload=function()
{
   //HERE
}
</script>

window.onload=function（）
{
//这里
}

除此之外，你还有其他一些问题

1） 如果浏览器是IE，那么你可能只需要一个div。如果不是IE，那么您也会得到一个额外的结束div，因为您缺少“if IE”div结束语句的条件

2） 根据HTML4，XHTML和HTML5规范

元素只能包含

元素作为直接子元素。您的

包含作为直接子元素的

元素。将

标记放在当前包装的

内。把两者颠倒过来

3）

是内联元素（除非用CSS另外设置），而

是块级元素（除非用CSS另外设置）。您不应该将块级元素放在内联元素中，而应该反过来放置。固定点2也会固定点3

---

祝你好运。

它在上面被切断了。。。它意味着从OK开始，所以出于某种原因，我的代码在这里不起作用。。。这是一个垂直的HTML/CSS导航菜单，由和“

&
• ”创建……感谢Three dot的编辑Hey，Ibu。加载整个jQuery库只是为了能够使用文档就绪处理程序是没有意义的。这是绝对正确的，但是想想看，onload事件也不是最好的选择。导航将首先显示，然后将消失。它会在页面上产生一个丑陋的效果。当然，我可以告诉他如何使用DOM就绪事件，这对于crossbrowser来说很复杂，但是为什么不使用19k jquery文件呢

  $(function () {
  // your script here
  ...
  });
  

  <script type="text/javascript">
  window.onload=function()
  {
     //HERE
  }
  </script>