1. 程式人生 > 實用技巧 >請實現滑鼠點選頁面中中任意標籤和實現鏈式呼叫,每日刷兩題

請實現滑鼠點選頁面中中任意標籤和實現鏈式呼叫,每日刷兩題

請實現滑鼠點選頁面中中任意標籤,alert該標籤名稱(注意相容性)
  document.onclick = function (e) {
      let a = e || window.event;  //處理相容,獲取時間物件
      let o = a['target'] || a['srcElement'];//處理相容,獲取資訊
      console.log(o.tagName)
    }
    //優雅實現
    function EleName(evt){
      evt=evt||window.event;
      let slttag=evt.target||evt.srcElement;
      let elename=slttag&&slttag.tagName?slttag.tagName.toLowerCase():'no tagName';
      console.log(elename);
    }

    window.onload=function(){
      let el =document.querySelector('body');
      el.onclick=EleName;
    }

  

//實現一個鏈式呼叫:鏈式呼叫的核心就在於呼叫完的方法將返回自身例項返回
 // 示例一
    function class1(){
      console.log('初始化')
    }
    class1.prototype.menthod=function(asg){
      console.log(asg)
      return this;
    }
    let cl=new class1();
    cl.menthod('第一次呼叫').menthod('第二次呼叫');
   // 示例二
    let obj={
      a:function(){
        console.log(
'a') return this; }, b:function(){ console.log('b'); return this; } } obj.a().b(); // 示例三 class MyMath{ constructor(value){ this.hasInit=true; this.value=value; if(!value){ this.value=0; this.hasInit=false
; } } add(){ let args=[...arguments]; let initValue=this.hasInit?this.value:args.shift(); const value=args.reduce((prev,curv)=>prev+curv,initValue); return new MyMath(value) } minus(){ let args=[...arguments]; let initValue=this.hasInit?this.value:args.shift(); const value=args.reduce((prev,curv)=>prev-curv,initValue); return new MyMath(value) } } let test=new MyMath(); let res=test.add(12,32,21).minus(12).add(123); console.log(res.value) //原型鏈是實現鏈式呼叫 Number.prototype.add=function(){ let _that=this; _that=[...arguments].reduce((prev,curv)=>prev+curv,_that); return _that; } Number.prototype.minus=function(){ let _that=this; _that=[...arguments].reduce((prev,curv)=>prev-curv,_that); return _that; } let num=0; console.log(num.add(1,2,3,4).minus(1,2,2))