一础芍、計(jì)時(shí)器
css樣式
<button class='btn1'>停止一次性定時(shí)器</button>
<button class='btn2'>停止永久性定時(shí)器</button>
script 一次性定時(shí)器
var btn1=document.querySelector('.btn1');
var btn2=document.querySelector('.btn2');
function show(){
? ? console.log('這是一次性定時(shí)器');
}//一次性定時(shí)器
script 永久性定時(shí)器
var timer=setTimeout(show,3000);
btn1.onclick=function(){
? ? clearTimeout(timer);
}
function print(){
? ? console.log('這是永久性定時(shí)器');
}
var times=setInterval(print,1000);
btn2.onclick=function(){
? clearTimeout(times);
}
二、instanceof
var arr=[1,2,3,4,5];
var obj={name:'jack'};
console.log(arr instanceof Array);
console.log(obj instanceof Array);
三病曾、深度克隆
var student={
? ? name:'jack',
? ? age:18,
? ? friend:['lily','lucy']
}
function clone(obj){
? ? var newObj=obj instanceof Array?[]:{};
? ? for(var key in obj){
? ? ? ? if(obj[key] instanceof Object){
? ? ? ? ? ? newObj[key]=clone(obj[key]);
? ? ? ? }else{
? ? ? ? ? ? newObj[key]=obj[key];
? ? ? ? }
? ? }
? ? return newObj;
}
? ? ? ? ?
var newObj=clone(student);
student.friend[0]='rose';
console.log(student.friend[0]);
console.log(newObj.friend[0]);
四筷凤、事件委托
事件委托：可以簡(jiǎn)單第理解為將子集的事件委托給父級(jí)來(lái)處理
div
<div class='boxs'>
? ? <button class='btn1'>按鈕1</button>
? ? <button class='btn2'>按鈕2</button>
</div>
script 第一種寫(xiě)法
var btn1 = document.querySelector(".btn1");
var btn2 = document.querySelector(".btn2");
btn1.addEventListener("click",function(){
? ? console.log(this.innerHTML)
})
btn2.addEventListener("click",function(){
? ? console.log(this.innerHTML)
})
script 第二種寫(xiě)法
var btnArray = document.querySelectorAll("button");
for(var i = 0;i<btnArray.length;i++){
? ? btnArray[i].addEventListener("click",function(){
? ? ? ? console.log(this.innerHTML)
? ? })
}
第三種:使用事件委托的方式實(shí)現(xiàn)
var box=document.querySelector('.boxs');
box.addEventListener('click',function(event){
? ? var target=event.target;
? ? console.log(target.innerHTML);
})
