循环中的异步回调函数

Question

这是与其他问题不同的情况。

我有几个具有class和data-label属性的div元素。

<div class='toLoad' data-label='a'></div>
<div class='toLoad' data-label='b'></div>
<div class='toLoad' data-label='c'></div>
<div class='toLoad' data-label='d'></div>

这是JavaScript：

function theData(e) {
  // What do I do here to put the data to their respective div
}

function createScript() {
  var elem = document.querySelectorAll('div.toLoad');
  for (var i = 0; i < elem.length; i++) {
    var theLabel = elem[i].getAttribute('data-label'),
      theLink = "/index/"+ theLabel +"&callback=theData",
      currentItem = elem[i],
      e = document.createElement('script');
    e.src = theLink;
    e.type = 'text/javascript';
    document.getElementsByTagName('head')[0].appendChild(e);
  }
}

放置上述Javascript之后，将添加一个script元素。 加载后，脚本将返回一个名为theData的回调函数，其中所有内容均作为参数。 我想将返回的内容附加到它们各自的div元素上。

我不知道如何准确地放入它们。

Answer 1

假设回调方法可用，并且它具有两个参数数据标签值（以标识应填充的div）和数据本身

function callback( dataLabel, htmlData )
{
  $( "div[data-label='" + dataLabel + "']".html( htmlData ) );
}