我正在創建一個石頭、紙、剪刀專案,但使用的是水、火和草口袋妖怪,而不是傳統的石頭剪刀布。當我單擊選擇的口袋妖怪“選擇”時,我希望玩家“玩家口袋妖怪”影像切換來源,以便可以清楚地顯示它是游戲中的選擇。但是,當我嘗試使用 currentSrc 執行此操作時,它不會在游戲中切換。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="styles.css" />
<title>Pokemon Battle</title>
</head>
<body>
<div id="container">
<h1 class="title">Pokemon Battle</h1>
<div class="computer container" id="computer-container">
<h2>Gym Leader Score</h2>
<p class="computer-score">0</p>
<img
src="pokeball.jpeg"
id="computer-pokemon"
class="computer pokemon"
/>
</div>
<div class="player container">
<img src="pokeball.jpeg" id="player-pokemon" class="player pokemon" />
<p class="player-score">0</p>
<h2>Trainer Score</h2>
</div>
<div class="party container" id="choices">
<img src="fire.jpeg" id="fire" class="choice" />
<img src="water.jpeg" id="water" class="choice" />
<img src="grass.jpeg" id="grass" class="choice" />
</div>
</div>
<script src="script.js"></script>
</body>
</html>
const choice = document.querySelectorAll(".choice");
const computerScore = document.querySelector(".computer-score");
const playerScore = document.querySelector(".player-score");
const computerChoice = document.getElementById("computer-pokemon");
let playerChoice = document.getElementById("player-pokemon");
let gymLeaderScore;
let trainerScore;
for (let i = 0; i < choice.length; i ) {
choice[i].addEventListener("click", function () {
// replace player pokeball with chosen pokemon
var playerImg = choice[i].currentSrc;
playerChoice.currentSrc = playerImg;
});
}

我嘗試使用回圈來收集選擇 currentSrc 并將其宣告為變數 playerImg,然后使其等于 playerChoice.currentSrc 變數,這是 img 中選擇的 poke 球的元素。
uj5u.com熱心網友回復:
嘗試這個
let choicesImg = document.querySelectorAll(".choice");
let imgOfPlayer = document.getElementById("player-pokemon")
choicesImg.forEach(img => {
img.addEventListener('click', e => {
imgOfPlayer.src = e.target.src
})
})
// You can also do it in one line of code like this:
choicesImg.forEach(img => img.onclick = e => imgOfPlayer.src = e.target.src )
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/451305.html
標籤:javascript html 图片 源代码
上一篇:當我嘗試上傳圖片時,Tweepy拋出錯誤。(AttributeError:“dict”物件沒有屬性“media_id_string”)
