问题:注册点击事件的时候,多次点击则会重复多次的创建元素
要求:不论点击多少次,只创建一次
思路:触发点击事件,若有,则不创建,若无,则创建
基础HTML代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>title</title>
<style>
div{
width: 200px;
height: 200px;
border: 1px solid red;
}
</style>
</head>
<body>
<input type="button" value="显示效果" id="btn"/>
<div id="dv"></div>
</body>
</html>
代码如下:
document.getElementById("btn").onclick=function () {
//判断,div中有没有这个按钮,有就删除
//判断这个按钮的子元素是否存在
if(!document.getElementById("btn2")){//如果为false则创建
var obj=document.createElement("input");
obj.type="button";
obj.value="按钮";
obj.id="btn2";
document.getElementById("dv").appendChild(obj);
}
};
