跨浏览器处理程序

最新推荐文章于 2024-08-15 08:55:57 发布

formoresy

最新推荐文章于 2024-08-15 08:55:57 发布

阅读量299

点赞数

分类专栏： javascript-DOM 文章标签： javascript 跨浏览器浏览器

本文链接：https://blog.csdn.net/formoresy/article/details/71515661

版权

javascript-DOM 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>DOM</title>
</head>
<body>

<input type="button" value="btn1" id="btn1" οnclick="getMassage()">
<input type="button" value="btn2" id="btn2">
<input type="button" value="btn3" id="btn3">
<input type="button" value="btn4" id="btn4">

<script type="text/javascript">
//1.HTML程序事件处理程序
function getMassage(){
alert("hello1");
}

// //2.DOM0级事件处理程序
// var btn2=document.getElementById('btn2');
// btn2.οnclick=function() {
// alert("hello2!");
// }
// btn2.οnclick=null;

// //3.DOM2级事件处理程序
// var btn3=document.getElementById('btn3');
// btn3.addEventListener('click',getMassage,false);
// btn3.removeEventListener('click',getMassage,false);

// //4.IE事件处理程序
// var btn4=document.getElementById('btn4');
// btn4.attachEvent('onclick',getMassage);

//5.跨浏览器处理程序
var eventUtil={
addHandler:function(elment,type,handler){
if(elment.addEventListener){//0级
elment.addEventListener(type,handler,false);
}else if(elment.attachEvent){//IE
elment.attachEvent('on'+type,handler);
}else{
elment['on'+type]=handler;
}
},

removeHandler:function(elment,type,handler){
if (elment.removeEventListener) {
elment.removeEventListener(type,handler,false);
}else if (elment.detachEvent) {
elment.detachEvent('on'+click,handler);
}else{
elment['on'+click]=handler;
}
}
}

eventUtil.addHandler(btn3,'click',getMassage);

</script>

</body>

</html>

之前在运行这个代码时，总是报错。各种检查尝试，发现以下两点需注意：

1.在把添加和删除两个方法封装在一个对象里时，两个方法之间必须要使用‘，’进行隔开，这点不可省略。

2.在写代码时，需要注意<script>所放的位置。是放在head里面，还是body里面，body里面的位置是在正文前还是正文后，都需要注意。在这里，假如把按钮位置放在<script>后面，则不能正常弹出对话框了。

formoresy

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
跨浏览器处理程序

DOM//1.HTML程序事件处理程序function getMassage(){alert("hello1");}// //2.DOM0级事件处理程序// var btn2=document.getElementById('btn2');// btn2.onclick=function() {// ale
复制链接

扫一扫

专栏目录