事件进阶、对象，阻止冒泡、默认事件，元素属性、设置元素样式

#事件
##6.4
##事件进阶

//事件：dom0  dom2
//dom2
添加：addEventListener('事件类型',事件的处理程序) 把前面的on去掉
可以给相同的元素绑定不同的事件
移除：removeEventListener('事件类型',函数名)
box.addEventListener('click',function(){
console.log(1)
})
box.addEventListener('click',fn)
function fn(){
console.log('测试')
}

btn.onclick = function(){
 box.removeEventListener('click',fn)
}

##事件对象event

var btn = document.getElementById('btn')
btn.onclick = function(event){
console.log(event.pagaX);//距离浏览器左侧的距离，包括滚动条滚动的距离
console.log(event.clientY);//距离浏览器上侧的距离，不包括滚动条滚动的距离
}

##阻止事件冒泡

var event = event || window.event  //浏览器兼容写法
event.stopPropagation()   //阻止事件冒泡

##阻止默认事件

//默认事件：a链接的跳转   表单的提交
var event = event ||window.event
event.preventDefault()   //阻止默认事件

##元素的属性操作

获取属性 getAttribute('属性名')
设置属性 setAttribute('属性名','属性值')
移除属性 removeAttribute('属性名')

##设置属性的几种方式

/*
1、对象.style
2、对象.ClassName
3、对象.setAttribute('style')
4、对象.setAttribute('class')
5、对象.style.setProperty("CSS属性","CSS属性值")
6、对象.style.cssText
*/