SOURCE

$.fn.setBanner = function (bannerData) {
  var bannerSize = {
    width: this.attr('banner-width'),
    height: this.attr('banner-height')
  };
  
  this.css(bannerSize);
  
  // 拼接 html 字符串
  var html;
  if (typeof(bannerData.length) != "undefined") {
    $.each(bannerData, function (index, item) {
      html += '<div><img src="' + item.imgUrl + '" /></div>'
    });
    this.html(html);
  } else {
    console.log('值的类型错误')
  }
}


// 数据模型
// 可以从后端用 ajax 获取

var banners = [
  {
    imgUrl: 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1494692313&di=6d8570cebeeeb2a72cb4a4d9a503fdaf&imgtype=jpg&er=1&src=http%3A%2F%2Fstatic.oschina.net%2Fuploads%2Fimg%2F201503%2F16154012_Shwu.png'
  },
  {
  	imgUrl: 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1494097659663&di=88867b25a6625db312aef79c1dcee72f&imgtype=0&src=http%3A%2F%2Fis2.mzstatic.com%2Fimage%2Fpf%2Fus%2Fr30%2FPurple7%2Fv4%2F5d%2Fe1%2Ffe%2F5de1fe18-16e9-090f-9e40-ca4f182532f3%2Fmzl.udgbgyos.png'
  },
  {
  	imgUrl: 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1494097659663&di=88867b25a6625db312aef79c1dcee72f&imgtype=0&src=http%3A%2F%2Fis2.mzstatic.com%2Fimage%2Fpf%2Fus%2Fr30%2FPurple7%2Fv4%2F5d%2Fe1%2Ffe%2F5de1fe18-16e9-090f-9e40-ca4f182532f3%2Fmzl.udgbgyos.png'
  }
];

$('#banner').setBanner(1);

<div id="banner" banner-width=400 banner-height=200 ></div>

#banner {
  width: 200px;
  height: 200px;
  background: #ccc;
}