javascript为＜a href=“#“＞文字连接创建表单格式，后台菜单生成input表单

<script type="text/javascript">
            var lis=document.getElementsByClassName("bd");
            var as=lis[0].getElementsByTagName("a");
            for(var i=0,len=as.length;i<len;i++)
            {
                switch(as[i].getAttribute("data-type"))
                {
                    case 'add':
                        as[i].onclick=function()
                        {
                            add();
                        }
                        break;
                    case 'mod':
                        as[i].onclick=function()
                        {
                            mod();
                        }
                }
                
            }
            lis=null;
            as=null;
            function add(){
                var div=document.getElementById("container");
                   
                var html="<ul><li>标&emsp;题：<input type=\"text\" name=\"title\" value=\"\" size=\" 20\"/></li><li>关键词：<input type=\"text\" name=\"keywords\" value=\"\" size=\" 20\"/></li> <li>描&emsp;述：<input type=\"text\" name=\"disecotro\" value=\"\" size=\" 20\"/></li><li>内&emsp;容：<br/><textarea rows=\"10\" cols=\"50\"></textarea></li> <li><input type=\"button\" name=\"button\" value=\"提交\"/></li>";
                //最好是这样一次性写完ul内的内容，也可以用创建元素的方法，不过要一次性赋值给html，然后一次性给innerHTML
                //不要循环赋值给innerHTML,如果内容量较大会引起内在不足或是泄漏问题，造成浏览器崩溃 
                    div.innerHTML=html;
                    div=null;
            }
            function mod(){
                var div=document.getElementById("container");                    
                var html="<ul><li>标&emsp;题：<input type=\"text\" name=\"title\" value=\"\" size=\" 20\"/></li><li>关键词：<input type=\"text\" name=\"keywords\" value=\"\" size=\" 20\"/></li> <li>描&emsp;述：<input type=\"text\" name=\"disecotro\" value=\"\" size=\" 20\"/></li><li>内&emsp;容：<br/><textarea rows=\"10\" cols=\"50\"></textarea></li> <li><input type=\"button\" name=\"button\" value=\"提交\"/></li>";
                //最好是这样一次性写完ul内的内容，也可以用创建元素的方法，不过要一次性赋值给html，然后一次性给innerHTML
                //不要循环赋值给innerHTML,如果内容量较大会引起内在不足或是泄漏问题，造成浏览器崩溃 
                    div.innerHTML=html;
                    div=null;
            }
           
            
           </script>

//html部分

 <div class="bd">
              <ul>
                <li ><a href="#" data-type="add">添加文章</a></li>
                <li ><a href="#" data-type="mod">修改</a></li>
                <li ><a href="#" data-type="del">删除</a></li>
              </ul>
            </div>
            <div id="container">

            </div>

 <style type="text/css">
            body,html
            {
                margin: 0;
                padding: 0;
            }
            .bd{
                border: solid 1px blue;
                width: 800px;
                margin: 0 auto;
            }
            .bd ul
            {
                margin: 0;
                padding: 0;
                width: 100%;
                height: 30px;
            }
            .bd li
            {
                list-style: none;
                float:left;
                margin-right: 5px;
                line-height: 1.87em;
            }
            .bd li a
            {
                text-decoration: none;
                font-size: 0.85em;    
            }
            #container
            {
                width: 800px;
                margin: 0 auto;
                margin-top: 20px;
            }
            #container ul
            {
                margin: 0;
                padding: 0;
            }

            #container li
            {
                list-style: none;
                margin-top: 10px;
                font-size: 0.85em;
                font-family:Arial, Helvetica, sans-serif
            }

            #container li:last-child
            {
                text-align: center;
                width: 50%;
                margin-top: 20px;
            }
            #container li:nth-child(4)
            {
               text-align: top;
                vertical-align: middle;
                display: inline-table;
            }

        </style>

//
最后输出样式