javascript动态创建控件三种方法

iteye_12421

于 2010-05-04 11:35:48 发布

阅读量247

点赞数

分类专栏： web 文章标签： JavaScript HTML ViewUI

web 专栏收录该内容

20 篇文章

订阅专栏

javascript动态创建控件的3种方法
以创建按钮为例

<html>
<head>
   <script>
    function add1()
   {
   var obtn=document.createElement("input");
obtn.setAttribute("type","button");
obtn.setAttribute("value","test1");
document.body.appendChild(obtn);//注意如果有form表单不要忘记加入表单
    }
function add2()
{
   var obtn=document.createElement("input");
   obtn.type="button";
   obtn.value="test2";
   document.body.appendChild(obtn);
}
function add3()
{
   var obtn="<input type='button' value='test3'/>";
   document.body.innerHTML=obtn;//这个方法会删除body中的其它控件 可以预先加到固定的容器中
  
}
   </script>  
</head>

<body>
<input type="button" value="add1" onclick="add1()"/>
<input type="button" value="add2" onclick="add2()"/>
<input type="button" value="add3" onclick="add3()"/>
</body>

</html>