如何在 javascript 中獲取圖像的 src

Question

我不斷從變量humanImageChoice的rpsFrontEnd()函數中返回“圖像未定義”，盡管我已經使用this來引用用戶的輸入。 需要你的幫助。

 function rpsGame(yourChoice) { console.log(yourChoice); var humanChoice, botChoice; humanChoice = yourChoice.id; botChoice = numberToChoice(randToRpsInt(randToRpsInt)); console.log('Computer Choice:' + botChoice); result = decideWinner(humanChoice, botChoice); //[0,1] human lost console.log(result); message = finalMessage(result); //you won console.log(message); rpsFrontEnd(yourChoice, botChoice, message); } function rpsFrontEnd(humanImageChoice, botImageChoice, message) { var imageDatabase = { 'rock': document.getElementById('rock').src, 'paper': document.getElementById('paper').src, 'scissors': document.getElementById('scissors').src } //removing the images onclicking an image document.getElementById('rock').remove(); document.getElementById('paper').remove(); document.getElementById('scissors').remove(); //creatin divs for the image choices to be placed in var humanDiv = document.createElement('div'); var botDiv = document.createElement('div'); var messageDiv = document.createElement('div'); humanDiv.innerHTML = "<img src='" + imageDatabase[humanImageChoice] + "'>" document.getElementById('flex-box-rps-div').appendChild(humanDiv); }

 <div class="container-3"> <h2>Challenge 3: Rock paper Scissors</h2> <div class="flex-box-rps" id="flex-box-rps-div"> <img id="rock" src="static/imgs/rock.jpg" height="150px" width=" 150px" onclick="rpsGame(this)" /> <img id="paper" src="static/imgs/paper.jpg" height="150px" width=" 150px" onclick="rpsGame(this)" /> <img id="scissors" src="static/imgs/scissors.jpg" height="150px" width=" 150px" onclick="rpsGame(this)" /> </div> </div>

Answer 1

圖像 src 不正確。 它將在rpsFrontEnd function 中，

humanDiv.innerHTML = "<img src='" + imageDatabase[humanImageChoice.src] + "'>"

或者在rpsGame function中，

 yourChoice.src

如果這不能解決問題，請檢查您的瀏覽器控制台。 也許它會給其他人 function 帶來另一個錯誤。