面试题基础题（1）

一、事件注册兼容

各个浏览器的都能够事件进行兼容

我们都可以知道：IE8是一个分水岭，除了IE8及其以下的浏览器意外，chrome、Firefox都基本支持以addEventListener方法来注册事件，以removeEventListener来解除事件。
解决办法如下;

var AddEventListener = {
				addHandler:function(element,type,handler){
					//绑定事件
					//Chrome Firefox IE9等     addEventListener 
					//IE8及IE8以下的浏览器     attachEvent 
					if(element.addEventListener){
						element.addEventListener(type,handler,false);
					}else if (element.attachEvent) {
						element.attachEvent("on"+ type,handler);
					} else{
						element["on"+type] = handler 
					}
				},
				removeHandler: function(element,type,handler){
					//移除事件
					//Chrome Firefox IE9等      
					//IE8及IE8以下的浏览器     
					if(element.removeEventListener){
						element.removeEventListener(type,handler,false);
					}else if (element.detachEvent) {
						element.detachEvent("on"+type,handler);
					} else{
						element["on"+type] = handler
					}
				}
			}

二、阻⽌止事件冒泡和事件默认事件

//阻止事件冒泡
e.stopPropagation;
e.cancelBubble = true;

//阻止事件默认事件
e.preventDefault();
e.returnValue = false;
return false;//只有句柄绑定可以⽤
//IE事件句柄注册方法
var elem = document.getElementById('a')
elem.attachEvent('onclick' 
  function()
    alert(window.event.srcElement.innerHTML + ' ' + this.innerHTML + 1);});

elem.attachEvent('onclick' 
  function()
    alert(window.event.srcElement.innerHTML + ' ' + this.innerHTML + 2);});

三、数组去重

//1.遍历数组，使用indexOf方法


 var arr = ['a','b',234,23,'a','b',3,1,234]
    function quChong(arr){
        var afterArr = [];
        for(var i =0;i<arr.length;i++){
            if(afterArr.indexOf(arr[i])==-1){
                afterArr.push(arr[i])
            }
            
        }
        console.log(afterArr);
        return afterArr;
    }
    
//使用ES6的Set方法去重

    function quchong2(arr){
        var set = new Set(arr)
        return [...set]
    }

四、javascript获取非行间样式的方法(可以兼容各个浏览器)

function getStyle(obj,name){
    if(obj.currentStyle){
        //IE
        return obj.currentStyle[name];
    }else{
        //FF、Chrome
        return getComputedStyle(obj,false)[name];
    }
};
window.onload=function(){
    var odiv=document.getElementById('div1');
    alert(getStyle(odiv,'width'));//获取到div宽<br>　
    
　	alert(getStyle(odiv,'backgroundColor'));//获取div背景颜色

}