多个XMLHttpRequests后的Javascript调用函数

我用新的html替换了一些div。到目前为止还不错

(function() { 

  var obj = function(div) {     

    var obj = {};
    obj.divToReplace = div;
    obj.objId = obj.divToReplace.dataset.id;

    obj.template = "<div class="newDivs"><p>@Name</p><img src='@ImageUrl'/></div>";

    obj.replaceDiv = function() {
        var xhr = new XMLHttpRequest();
        xhr.open( 'GET', encodeURI('http://.../' + obj.objId) );
        xhr.onload = function(e) {
            if (xhr.status === 200) {
                var x = JSON.parse(xhr.responseText).data.attributes;

                var newHtml = obj.template
                            .replaceAll("@Name", x.name)
                            .replaceAll("@ImageUrl", x.imageUrl);

                obj.divToReplace.outerHTML = newHtml;
            }
            else {
                console.log(xhr.status);
            }
        };
        xhr.send();

    };

    return {
        replaceDiv: obj.replaceDiv
    }

};

String.prototype.replaceAll = function(search, replace)
{
    return this.replace(new RegExp(search, 'g'), replace);
};

//get the elements I want to replace
var elems = document.getElementsByClassName('divToReplace');

//replace them
for (i = 0; i < elems.length; i++) { 
    obj(elems[i]).replaceDiv();
}

//call handleStuff ?


})();

（函数（）{
var obj=函数（div）{
var obj={}；
obj.divToReplace=div；
obj.objId=obj.divToReplace.dataset.id；
obj.template=“@Name
”；
obj.replaceDiv=函数（）{
var xhr=new XMLHttpRequest（）；
xhr.open（'GET'，encodeURI（'http://.../“+obj.objId”）；
xhr.onload=函数（e）{
如果（xhr.status==200）{
var x=JSON.parse（xhr.responseText）.data.attributes；
var newHtml=obj.template
.replaceAll（“@Name”，x.Name）
.replaceAll（“@ImageUrl”，x.ImageUrl）；
obj.divToReplace.outerHTML=newHtml；
}
否则{
控制台日志（xhr.status）；
}
};
xhr.send（）；
};
返回{
replaceDiv:obj.replaceDiv
}
};
String.prototype.replaceAll=函数（搜索、替换）
{
返回此.replace（新的RegExp（搜索'g'），replace）；
};
//获取我要替换的元素
var elems=document.getElementsByClassName（'divToReplace'）；
//替换它们
对于（i=0；i

然后我想把addEventListener添加到div中，就在这里我被卡住了。我想在替换所有div之后调用handleStuff（）。（当然，在我替换它们之前，新的div不存在。）并且我不能使用jQuery

 var handleStuff = function(){

   var classname = document.getElementsByClassName("newDivs");

   var myFunction = function() {

   };

   for (var i = 0; i < classname.length; i++) {
       classname[i].addEventListener('click', myFunction, false);
   }
   ...............

var handlesuff=function（）{
var classname=document.getElementsByClassName（“newDivs”）；
var myFunction=function（）{
};
对于（var i=0；i

---

我如何添加一个回调来告诉我何时所有的div都被替换了？或者对于我正在尝试做的事情来说，这不是一个好的解决方案？

很抱歉之前使用了jQuery，下面是一个本机承诺的解决方案（已测试）

（函数（）{
变量f={
发送：函数（）{
var承诺=新承诺（功能（解决、拒绝）{
var xhr=new XMLHttpRequest（）；
xhr.open（'GET'，encodeURI（'http://www.google.com/') );
xhr.onload=函数（e）{
如果（xhr.status==200）{
//你的代码
解决（）；
console.log（'resolve'）；
}否则{
控制台日志（xhr.status）；
}
};
xhr.send（）；
});
回报承诺；
}
}
var承诺=[]；
对于（i=0；i<100；i++）{
promises.push（f.send（））；
}
Promise.all（promises）.then（function（）{
console.log（'success'）；
});
})();

在替换HTML后的回调中调用

handleStuff

，此处：

obj.divToReplace.outerHTML=newHtml；handleStuff（）；

但是handleStuff被调用了几次，并且在所有div被替换之前也是如此。@Sme那么在Ajax调用中调用它有什么问题吗？正如我所写的，我不能使用jQuery，只能使用本机javascript。很抱歉，完全错过了它。@Sme改为香草javascript

(function() {

  var f = {
    send : function(){
        var promise = new Promise(function(resolve, reject){
            var xhr = new XMLHttpRequest();
            xhr.open( 'GET', encodeURI('http://www.google.com/') );
            xhr.onload = function(e) {
                if (xhr.status === 200) {
                    //your code
                    resolve();
                    console.log('resolve');
                } else {
                    console.log(xhr.status);
                }
            };
            xhr.send();
        });
        return promise;
    }
  }

  var promises = [];
  for (i = 0; i < 100; i++) { 
      promises.push(f.send());
  }

  Promise.all(promises).then(function(){
      console.log('success');
  });
})();