<html>
<style text/css>
#menu { height: 40px; width: 960px; margin:3px auto; background-color:#CC0066; clear:both;}
#menu #ul {height: 40px; list-style-image: none; list-style-type: none; line-height:40px; vertical-align:middle; display:inline;}
#menu .li{width:70px; float:left;}
#menu #put{float:right;margin:15px 0 0 0;cursor:pointer}
</style>
<script text/javascript>
function add_div()
{
var o=document.createElement("div")
o.className="mo"
o.id="li"
$('ul').appendChild(o)
o.innerHTML="新页面"}
</script>
<div id="menu">
<div id="put" onclick="add_div();">新建页面</div>
<div id="ul">
<div class="li" id="li1">关于我们</div>
<div class="li" id="li2">活动公告</div>
<div class="li" id="li3">佳品展示</div>
<div class="li" id="li4">相册</div>
<div class="li" id="li5">网上订单</div>
<div class="li" id="li6">联系我们</div>
<div class="li" id="li7">榜中榜</div>
</div></div>
问题是如何点“新建页面"调用add_div();之后产生新的div 谢谢
#menu { height: 40px; width: 960px; margin:3px auto; background-color:#CC0066; clear:both;}
#menu #ul {height: 40px; list-style-image: none; list-style-type: none; line-height:40px; vertical-align:middle; display:inline;}
#menu .li{width:70px; float:left;}
#menu #put{float:right;margin:15px 0 0 0;cursor:pointer}
</style>
</head><script text/javascript>
function $(id){ return document.getElementById(id);};
function add_div()
{
var o=document.createElement("div")
o.className='mo';
o.id='li';
$("ul").appendChild(o)
o.innerHTML="新页面"}
</script>
<div id="menu">
<div id="put" onclick="add_div();">新建页面</div>
<div id="ul">
<div class="li" id="li1">关于我们</div>
<div class="li" id="li2">活动公告</div>
<div class="li" id="li3">佳品展示</div>
<div class="li" id="li4">相册</div>
<div class="li" id="li5">网上订单</div>
<div class="li" id="li6">联系我们</div>
<div class="li" id="li7">榜中榜</div>
</div></div>
铵一楼说的做了 可效果如图 div好象加了 可内容却是XX