Array JS 中的 52 个图像
P粉267885948
P粉267885948 2024-03-30 21:14:49
0
1
374

我正在学习 IT 助理 1 年,目前我们必须使用 JavaScript HTML 和 CSS 编写纸牌游戏。

我的问题是:如何在JS中将52张卡片放入一个数组中,仅提供放置这些卡片的所有图像的文件夹的路径,然后显示它们?

我尝试了下面的代码,这是我自己编写的;但它们只会显示在控制台中。如果您只告诉我我做错了什么就足够了,这会导致页面上的图像无法显示:

function Start() {

  let Karten = ["1h.png", "1k.png", "1ka.png", "1p.png", "2h.png", "2k.png", "2ka.png", "2p.png", "3h.png", "3k.png", "3ka.png", "3p.png", "4h.png", "4k.png", "4ka.png", "4p.png", "5h.png", "5k.png", "5ka.png", "5p.png", "6h.png", "6k.png", "6ka.png", "6p.png", "7h.png", "7k.png", "7ka.png", "7p.png", "8h.png", "k.png", "8ka.png", "8p.png", "9h.png", "9k.png", "9ka.png", "9p.png", "10h.png", "10k.png", "10ka.png", "10p.png", "kingh.png", "kingk.png", "kingka.png", "kingp.png", "queenh.png", "queenk.png", "queenka.png", "queenp.png", "soldath.png", "soldatk.png", "soldatka.png", "soldatp.png"];

  document.getElementById("Spieler1").src = Karten;

  console.log(Karten);

}
<main>

  <div id="alles">
    <div id="Spieler1">
      spieler1
    </div>
    <div id="Spieler2">
      spieler2
    </div>
    <div id="Spieler3">
      spieler3
    </div>
    <div id="Spieler4">
      spieler4
    </div>
  </div>

  <!-- Kartenfeld in der Mitte von jeder Spieler -->

  <div id="Mittel-Container">
    <div class="SP1-Container">
      spieler1
    </div>
    <div class="SP1-Container">
      spieler2
    </div>
    <div class="SP3-Container">
      spieler3
    </div>
    <div class="SP4-Container">
      spieler4
    </div>

    <!-- Knopf zum Starten -->
    <button id="Start-button" onclick="Start()">Start</button>
  </div>

</main>

<footer>

</footer>

P粉267885948
P粉267885948

全部回复(1)
P粉026665919

您的元素不是 ID 为 Spieler1 的图像元素。这就是为什么你不能设置它的 src 属性。

function Start() {

  let Karten = ["1h.png", "1k.png", "1ka.png", "1p.png", "2h.png", "2k.png", "2ka.png", "2p.png", "3h.png", "3k.png", "3ka.png", "3p.png", "4h.png", "4k.png", "4ka.png", "4p.png", "5h.png", "5k.png", "5ka.png", "5p.png", "6h.png", "6k.png", "6ka.png", "6p.png", "7h.png", "7k.png", "7ka.png", "7p.png", "8h.png", "k.png", "8ka.png", "8p.png", "9h.png", "9k.png", "9ka.png", "9p.png", "10h.png", "10k.png", "10ka.png", "10p.png", "kingh.png", "kingk.png", "kingka.png", "kingp.png", "queenh.png", "queenk.png", "queenka.png", "queenp.png", "soldath.png", "soldatk.png", "soldatka.png", "soldatp.png"];

 var elmnt= document.getElementById("Spieler1");
for (let i = 0; i 
spieler1
spieler2
spieler3
spieler4
spieler1
spieler2
spieler3
spieler4
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板