当用兼容的方法,给同一个对象添加不同的属性时,是不是只添加前面的属性,后面的就忽略了,和DOM2级不一样啊1
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8"/>
<title>事件流的DOM时间对象</title>
</head>
<body>
<div>
<input type="button" value="按钮1" id="btn1" onclick="message()"/>
<input type="button" value="按钮2" id="btn2"/>
<input type="button" value="按钮3" id="btn3"/>
</div>
<script type="text/javascript">
//HTML级事件处理程序
function message(event)//封装一个函数,必须加
{
alert("Hello world!");
//alert(event.type);
}
function message1(e)
{
alert(event.target);
}
function show(e)
{
alert(event.type);
}
var D=document.getElementById("btn3");
//创建一个对象,对象中有两个方法
var evently={
addhandler:function(element,type,handler)
{
if(element.addEventListener)//不加括号,以属性的形式判断,一般加了括号立即执行
{
element.addEventListener(type,message,false);
}
else if(element.attachEvent)
{
element.attachEvent("on"+type,handler);
}
else
{
element["on"+type]=handler;
}
},
removehandler:function(element,type,handler)
{
if(element. removeEventListener)//不加括号,以属性的形式判断,一般加了括号立即执行
{
element. removeEventListener(type,message,false);
}
else if(element.detachEvent)
{
element.detachEvent("on"+type,handler);
}
else
{
element["on"+type]=null;
}
}
}
evently.addhandler(D,"click",message);
evently.addhandler(D,"click",show);
evently.addhandler(D,"click",message1);
//evently.removehandler(D,"click",message);
</script>
</body>
</html>