javascript中createElement的两种创建方式
本文实例讲述了javascript中createElement的两种创建方式。分享给大家供大家参考。具体实现方法如下：
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<title>CreateElement的两种创建方式</title>
<scripttype="text/javascript">
functionCreateButton1(){
varbtn=document.createElement("input");
btn.type="button";
btn.value="我是动态创建的1";
btn.onclick=function(){
alert(this.value);
}
document.body.appendChild(btn);
}
functionCreateButton2(){
varbtn=document.createElement("<inputtype='button'value='我是动态创建的2'"+"onclick='OnClick2(this)'/>");
document.body.appendChild(btn);
}
functionOnClick2(btn){
alert(btn.value);
}
functionCreateLink(){
varlink=document.createElement("<ahref='http://www.baidu.com'>百度</a>");
//注意这里链接的文本“百度”是不会显示出来的，
//必须设置innerText或innerHTML
link.innerText="百度";
document.body.appendChild(link);
}
functionCreateLabel(){
varlbl=document.createElement("label");
lbl.setAttribute("for","userName");
lbl.setAttribute("myAge","12");
//可以设置自定义标示
lbl.innerText="用户名:";
document.body.appendChild(lbl);
}
</script>
</head>
<body>
<inputtype="button"value="动态创建按钮1"onclick="CreateButton1()"/>
<inputtype="button"value="动态创建按钮2"onclick="CreateButton2()"/>
<inputtype="button"value="动态创建链接"onclick="CreateLink()"/>
<inputtype="button"value="动态创建Label"onclick="CreateLabel()"/>
<inputtype="text"id="userName"value="李莫"/>
</body>
</html>
希望本文所述对大家的javascript程序设计有所帮助。