从图像链接的JavaScript数组已来自数据库的Javascript显示器3随机图像(Displa

我奋力把3张随机图像（不重复）我的Javascript数组，并把它们打印在单独的div内屏幕。

我的Javascript数组是由包含在服务器上的图像的链接/位置的数据库填充。

目前，我的网页看起来是这样的：

<html>
   <head>
  </head>
   <body>
    <div></div>
    <script>
      var items = [
      {name:'Coch',image:'upload/coch.png'},{name:'Glas',image:'upload/glas.png'},     {name:'Melyn',image:'upload/melyn.png'},{name:'Ci',image:'upload/dog.jpg'},    {name:'Cath',image:'upload/cath.jpg'},{name:'Gwyrdd',image:'upload/gwyrdd.png'},{name:'Un',image:'upload/un.jpg'},{name:'Dau',image:'upload/dau.jpg'},{name:'Tri',image:'upload/tri.jpg'},{name:'Bochdew',image:'upload/bochdew.jpg'},{name:'Piws',image:'upload/piws.png'}      ];
      for (var i = 0; i < items.length; i += 1) {
        document.getElementsByTagName('div')[0].innerHTML += items[i].name + " / " +       items[i].image + "<br />\n";
      } 
    </script>
  </body>
</html>

此代码简单地取从数据库中的图像的链接并将它们插入到一个javascipt的阵列。（并打印屏幕上的链接此刻）

谁能给我如何得到这个工作的任何帮助吗？采取从阵列3个随机图像链接（无重复的），以及在3周不同的div在屏幕上显示3个图像。

我不擅长与javascipt的所有和任何代码示例将是巨大的。

感谢您事先的任何答复。

Answer 1:

洗牌的数组，然后取前三个项目。在这里你可以找到一个不错的功能洗牌阵列：如何随机化（随机播放）JavaScript数组？

Answer 2:

假设链接到图像源相对于页面正确的图像将是，这应该做的伎俩：

var list = document.getElementsByTagName('div')[0];
for(i = 0; i < 3; i++) {
  // Choose a random item and remove it from the array
  var item = items.splice(Math.floor(Math.random() * items.length), 1)[0];

  // Create the image element and set its src attribute
  var image = document.createElement('img');
  image.src = item.image;

  // Add it to your container element
  list.appendChild(image);
}

请注意，这将修改“项目”阵列，因此，如果您以后需要它，你需要将阵列的第一复制或调整的逻辑。

的jsfiddle： http://jsfiddle.net/ynhCN/1/

文章来源: Display 3 random images in Javascript from an javascript array of image links that have come from a database