Javascript 如何按id随机显示三个div而不重复？用于扑克牌洗牌和其他

我想显示三个扑克牌创建和样式的HTML和CSS随机没有重复。基本上，我希望卡是随机选择的id和显示。我知道还有其他方法可以做到这一点（即在Javascript中创建代码组本身），但我更愿意找到一种方法，使用Javascript按id显示HTML元素，因为它可以重新调整用途，以显示其他以css样式的HTML元素，如图像、文本或任何id为三的元素，或者一次显示更多。我也希望这是一个onclick事件

在下面的代码中，我尝试将id放入数组中，但是当我运行代码时，括号中的文本显示在页面上，而不是id元素本身。这也是在加载而不是单击时发生的。请注意，代码中的省略号不在代码中，它们只是用来表示剩余的元素。我已经做了一些彻底的研究，试图找到一种方法来实现这一点，尝试了许多方法，但还没有找到一种方法来同时显示多个元素（大多数seen示例使用getElementById方法，该方法只适用于一个元素）。我看到的多个显示数组中文本元素的方法。有没有人知道如何让代码以我指定的方式工作，或者有其他想法

HTML:

标题
2.♦
2.♥
2.♣
2.♠
3.♦
3.♥
3.♠
3.♣
4.♦
4.♥
4.♣
4.♠
5.♦
5.♥
5.♣
...

Javascript/Jquery：

var myarray = ["card1","card2","card3","card4","card5","card6","card7","card8","card9","card10","card11","card12","card13","card14","card15"...];

var numberOfTestimonials = 3;

for (var i=1; i<=numberOfTestimonials; i++) {
  var randomIndex = RandomDiv(myarray);

  $('.card').append(myarray[randomIndex]);
  myarray.splice(randomIndex, 1);
}

function RandomDiv(myarray) {
  return Math.floor(Math.random() * myarray.length);    
};

var myarray=[“card1”、“card2”、“card3”、“card4”、“card5”、“card6”、“card7”、“card8”、“card9”、“card10”、“card11”、“card12”、“card13”、“card14”、“card15”…]；
var NumberOfEstimations=3；
对于（var i=1；i您可以尝试这样的方法

var myarray =  $(".cards")

这将正确地抓住元素

把你所有的牌都给我

display: none;

css，并在需要时显示它们。
您只需添加卡阵列中的文本。您需要的是

$('.card').append(document.getElementById( myarray[randomIndex]));

您只追加来自
myarray index
的文本，请使用下面的行追加元素，如

$('.card').append($('#' + myarray[randomIndex]));

片段


var myarray=[“card1”、“card2”、“card3”、“card4”、“card5”、“card6”、“card7”、“card8”、“card9”、“card10”、“card11”、“card12”、“card13”、“card14”、“card15”]；
var NumberOfEstimations=3；
函数getRandom（）{
对于（var i=1；i这里，我修复了您的代码：


var symbols=['&spades；'、'&clubs；'、'&hearts；'、'&diams；']；
函数RandomDiv（）{
对于（i=1；我首先看到您的span元素没有正确关闭，因为它们没有右括号“>”。其次，您使用的append方法没有用于插入文本。您应该首先使用$（选择器）选择具有指定id的项。然后附加它。好的，非常感谢。我应该包括我的css，它的卡片位于“display:none”。上面的代码的工作原理是它从数组中选择三张卡片。但它只有在我已经显示了所有卡片的情况下才起作用（即“display:inline block”）。是否可以修改上述代码，以便在单击时从显示的0个元素变为三个元素？是的，通过使所有
卡像
$（'.cards'）一样隐藏。隐藏（）
然后只显示3张随机卡。我应该把它放在代码行的哪个位置？单独放置还是放在函数中，它会隐藏元素，并且不会在单击时显示。在getRandom函数中
函数getRandom（）{$（'.cards'）.hide（）；对于（…）{…在这里显示卡元素…}
我尝试了函数getRandom（）{$（'.cards'））.hide（）；for（var i=1；i Ok awesome！我很高兴地说这是可行的，出于某种原因，我认为
getElementById
只能获得一个元素。但是，在css中，所有元素都设置为
display:none
，因此除非追加，否则不会显示。追加元素不会改变这一点（即，三个随机元素的显示方式与之前数组中的文本不同）。您知道如何修改函数（或其他方法），使三个随机卡（仅三个随机卡）从
显示：无
变为显示（最好通过
显示；内联块
？
$('.card').append($('#' + myarray[randomIndex]));