一、浅克隆、深克隆
(1)浅克隆:
案例:
Js部分:function clone(){ var student1={};
for(var key in student){
student1[key]=student[key]
}
return student1;
}
var student1=clone();
console.log(student1);
student.name='rose';
console.log(student1);
(2)深克隆:
案例:
Js部分:function clone(obj){
var student1=obj instanceof Array?[]:{};
for(var key in obj){
if(obj[key] instanceof Object){ student1[key]=clone(obj[key]);
}else{
student1[key]=obj[key];
}
} return student1;
}
var student1=clone(student);
console.log(student1);
student.friend[0]='Tom';console.log(student1);
二、事件流内联事件:
.onclick 事件监听:
.addEventListener('事件',function(){})
三、事件冒泡和事件捕获案例:
Body部分:
Js部分:
var box=document.querySelector('.box');
var list=document.querySelector('.list');
var li=document.querySelector('.li');
box.addEventListener('click',function(){ alert('我是box'); },true)
list.addEventListener('click',function(){ alert('我是list'); },true)
li.addEventListener('click',function(){ alert('我是li'); },true)
//事件冒泡:从内到外依次触发//事件捕获:从外到内依次触发(添加true)
四、事件委托
事件委托:可以简单第理解为将子集的事件委托给父级来处理案例:
Body部分
按钮1
按钮2
js部分
var box=document.querySelector('.boxs');
box.addEventListener('click',function(event){
var target=event.target;
console.log(target.innerHTML);
})
var btn=document.createElement('button');
btn.innerHTML='按钮3';btn.className='btn3';
document.querySelector('div').appendChild(btn);