1.事件绑定的方式
a.通过HTML元素
进行绑定。（即
’）
b.通过js的方式
进行绑定，即：obj.onclick = function(){}
c.事件监听
addEventListener()
事件监听的好处
1—可以为同样的元素绑定多次同一个事件
2—程序员可以使用事件监听的方式 确定触发的过程是冒泡还是捕获
事件监听的语法：
事件源.addEventListener(“去掉on的事件”,function(){},【事件捕获还是冒泡，true/false) 默认是false 冒泡】
【注】：当相同的元素绑定相同的事件，且捕获和冒泡同时存在时，捕获优先于冒泡
2.事件绑定的取消
1.再给事件赋空值
document.onclick = function(){
alert(1);
}
document.onclick = null;
2.removeEventListener（）用这个取消事件监听的绑定
var fun = function(){
alert(1);
}
document.addEventListener("click",fun);
//注意事项:两个方法的回调函数必须是同一个函数对象才可以取消
document.removeEventListener("click",fun);
3.事件委托：
1.定义：
委托:让别人取做你应该做的事； 依赖于冒泡机制
2.好处
1:可以通过委托机制批量为子元素添加事件，提高运行效率
核心:获取真实操作源素
? var target = e.srcElement || e.target;
? 获取真实操作源的标签名(都是大写)
? console.log(target.tagName);
target.tagName == “LI”【注：后面的标签名必须大写】
2.可以为未来创建的元素,提前通过父元素绑定事件
4.json对象的和字符串的相互转换
JSON对象和字符串的相互转换
ES6提供的两个函数
1.字符串->json对象 JSON.parse
var str = '{"name":"老王","age":18}';
var json = JSON.parse(str);
console.log(json.name,json.age);
2.json对象->字符串 JSON.stringify
var* json = {"name":"老王","age":18};
*var* str = JSON.stringify(json);
console.log(typeof str);
5.拖拽效果
拖拽思路： onmousedown onmousemove onmouseup
1.首先为需要拖拽的对象添加一个onmousedown事件
记录：鼠标点击某个对象时的内部偏移量
e.offsetX e.offsetY
2.鼠标在文档上移动
要想让操作的元素动起来，该元素必须有定位
移动的过程，实际上改变，元素的left和top
3.停止移动，需要触发onmouseup鼠标抬起时，取消移动
document.onmousemove = null;
|