一建炫、淺克隆、深克隆
（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);
二、事件流內(nèi)聯(lián)事件：
.onclick? ? 事件監(jiān)聽:
.addEventListener('事件',function(){})
三艺配、事件冒泡和事件捕獲案例：
Body部分：
<div class="box">
? ? ? ? <div class="list">
? ? ? ? ? ? <div class="li"><div>
? ? ? ? ? ? </div>
? </div>
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)
//事件冒泡：從內(nèi)到外依次觸發(fā)//事件捕獲：從外到內(nèi)依次觸發(fā)（添加true）
四察郁、事件委托
事件委托：可以簡單第理解為將子集的事件委托給父級(jí)來處理案例：
Body部分
<div class="boxs">
<button class="btn1">按鈕1</button>
<button class="btn2">按鈕2</button>
</div>
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);
