借助JQuery更简单实现,这里是一个用原生javascript实现的示例:
<html>
<head>
<title></title>
<scripttype="text/javascript">
functionaddButton(){
varhtml="<inputtype=\"button\"value=\"新加\"onclick=\"newButton()\">"
document.getElementById("add").innerHTML=html
}
functionnewButton(){
alert("我是新加的按钮")
}
</script>
</head>
<body>
<div>
<p>点击该按钮增加一个新按钮</p>
<inputtype="button"value="点击增加"onclick="addButton()">
<p>新增的按钮在这显示</p>
<divid="add"></div>
</div>
</body>
</html>
JavaScript一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。
它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能。
1、创建一个元素时,使用createElement()函数2、设置元素属性可以有以下两种常用方式,首先获得具体元素的引用,
a)然后使用elementName.id=""设置她的id属性,同样可以设置name等属性,具体针对不同的页面元素有不同的属性,可以参考DHTML参考手册
b)使用setAttribute函数,elementName.setAttribute("id","elementId")
两种方式各有千秋,例如在设置class属性时就存在a)不好使用的情况,在使用中需要注意。
3、删除页面元素。删除时首先需要获得需要删除的元素的引用,然后使用removeChild函数就可以删除该元素了。必须要获得引用后才可以删除(注意)。
4、无论是创建或者删除页面元素,针对的对象是document.body。如果需要查看生成页面元素后的代码,需要使用document.body.innerHTML来查看,直接查看源文件是无法看见的。
5、设置disable属性也比较简单,只需要将其作为button对象的一个属性,设置为true就可以了。
function change_style(){
button=exist()
button.setAttribute("class","bt")//Mozilla设置class的方法
button.setAttribute("className","bt")//IE设置class的方法
/*下面的设置方法在Mozilla中有效,在IE中无效*/
//button.class="bt"
//button.className="bt"
}
1、首先打开hbuilder,新建一个html文件,在里面写入input按钮设置id属性并绑定添加按钮的事件:
2、然后在下面的script标签中编写按钮事件函数,里面首先用createElement函数创建一个input标签,设置type属性和value属性,最后给新按钮添加点击的监听事件,当点击以后就创建这个按钮,最后在函数最外层调用一下就可以了:
3、最后打开浏览器,可以看到一个添加按钮的按钮:
4、多次点击该按钮,下方会新建出一排按钮:
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)