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程序设计有所帮助。
热门推荐
10 小红书平安祝福语简短
11 生日祝福语大全女孩简短
12 收生日红包祝福语 简短
13 领证幽默祝福语简短
14 法考面试祝福语简短
15 老哥出门祝福语简短语
16 送灯祝福语简短独特
17 幼儿狗年祝福语大全简短
18 好听的元旦简短祝福语