HCJS_Zee
DoubleSRZee
采纳率100%
2017-11-21 12:23

JavaScript中push()和push.call()的使用

已采纳

最近在写一个简单的jq的id元素获取的实现,在使用push遇到了点小麻烦。感觉push和push.call实现都可以,但是push无法实现。

代码大致意思是:通过封装了的循环函数去获取id元素,在循环函数中实现改变元素样式。封装时,为了函数中能够使用数组中的数据,使用函数的call方法借用了上下文,然后执行获取元素的函数,是用正则匹配id选择器字符,将获取到的dom节点追加到数组results中。问题出在了这里!追加的过程使用push直接追加不能实现,使用push.call()可以实现。以下是代码截图。

使用push时,打开控制台会显示错误this.style is undefined,div颜色无效。

 <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style>
        div {
            width: 100px;
            height: 30px;
            border: 1px solid red;
            margin: 10px 0;
        }
    </style>
</head>
<body>
<div id="dv"></div>
</body>
<script>
    var getId = function(id,results){
        results = results || [];
        var rquickExpr = /^(?:#([\w-]+))$/,
                m = rquickExpr.exec(id);
        if(m){
           if(m[1]){
               results.push.call(results,document.getElementById(m[1]));
//               results.push(results,document.getElementById(m[1]));  
               return results;
           }
        }
    };
    var each = function(arr,fn){
        for(var i = 0 ; i < arr.length;i++){
            if(fn.call(arr[i]) === false){//借用上下文,fn的this指向数组中的元素
                break;
            }
        }
    };
    each(getId('#dv'),function(){
        this.style.backgroundColor = 'pink';
    });
</script>
</html>
  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享
  • 邀请回答

1条回答

  • danielinbiti danielinbiti 4年前
     没有push.call(),这是call函数的使用,不是push具有的
     具体可以看js的call函数
     results.push.call(results,document.getElementById(m[1]));
     =》
     results.push(document.getElementById(m[1]));
    
    点赞 2 评论 复制链接分享

相关推荐