Question

document.getElementById("nav01").innerHTML = 
    "<ul id='menu'>" + 
    "<li><a href='index.html'>Home</a></li>" + 
    "<li><a href='calendar.html'>Calendar</a></li>" + 
    "<li><a href='photos.html'>Photos</a> 
    <ul><li><a href='Test.html'>test</a></li></ul></li>"+ 
    "<li><a href='events.html'>Events</a></li>"+ 
"</ul>"; 



/*Navagation CSS*/ 
ul#menu { 
    padding: 0; 
    margin-bottom: 11px; 
} 

ul#menu li { 
    display: inline; 
    margin-right: 3px; 
} 

ul#menu li a { 
    background-color: #CCC; 
    padding: 10px 20px; 
    text-decoration: none; 
    color: #696969; 
    border-radius: 4px 4px 0 0; 
} 

ul#menu li a:hover { 
color: white; 
background-color: black; 
} 

ul#menu li a:active{ 
    background-color:blue; 
} 

这是我用来创建菜单的脚本代码。我遇到的问题是我无法使测试菜单像子菜单一样工作。如果它不在那里，菜单就像它应该那样工作。

这是一个完整的脚本代码

我已经加入CSS代码，因为这可能会用眼神帮助我试图实现

Answer 1

试试这个

document.getElementById("nav01").innerHTML = 
"<ul id='menu'>" + 
"<li><a href='index.html'>Home</a></li>" + 
"<li><a href='calendar.html'>Calendar</a></li>" + 
"<li><a href='photos.html'>Photos</a> 
"<ul><li><a href='Test.html'>test</a></li></ul></li>"+ 
"<li><a href='events.html'>Events</a></li>"+ 
"</ul>" 

内<ul>必须部分<li>的外部<ul>

也参考

http://www.w3.org/wiki/HTML_lists#Nesting_lists

你想如何显示？

当我到

http://www.w3schools.com/html/tryit.asp?filename=tryhtml_intro

我看到

是这不是你想要的？