如何将JS数组中的每个项目作为单独的html元素返回?

时间:2018-05-16 10:31:14

标签: javascript html

下面的数组就是我所拥有的,下面的html就是我正在尝试的 回来,任何想法如何实现这一目标?

 function onChange(e) {
    var selected = this.select()[0],
        item = this.dataItem(selected);
    var info = [item.LeadID, item.Subject, item.Email, item.Phone];
    var moreInfo = info.join('<span>'+info+'</span>');
    document.getElementById("moreInfo").innerHTML =  moreInfo;
}
    <div id="moreInfo">
      <span>211</span>
      <span>Re: Energy Transfer</span>
      <span>evelyn.adams@sampleemail.com</span>
      <span>0457767890</span>
    </div>

1 个答案:

答案 0 :(得分:1)

您应该通过传递回调提供的函数作为参数来使用map方法。使用map的范围是创建<span>elem</span>

等元素

然后使用join方法创建字符串将作为moreInfo DOM 元素的 innerHTML 属性的值传递。

var info = [1, 2, 3, 4];
var moreInfo = info.map(a=> '<span>'+a+'</span>').join('');
document.getElementById("moreInfo").innerHTML =  moreInfo;
console.log(document.getElementById("moreInfo").innerHTML);
<div id="moreInfo"></div>