Question

我试图通过创建一个新的 div 来打印 img，然后将其附加到图像，但图像没有显示出来。

HTML

<body>
    <div id="col" class="container-fluid">
        <h2>Rock Paper Scissor</h2>
        <div class="row">
            <div id="col-1" class="col-lg-4">
                <img id="rock"
                    src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRTNKl4bKaZufRk7DkQGewkv4cNYlQ0qpkdyA&usqp=CAU"
                    alt="" onclick="rpsGame(this)">

            </div>
            <div class="col-lg-4">
                <img id="paper"
                    src="data:image/jpeg;base64,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"
                    alt="" onclick="rpsGame(this)">

            </div>
            <div class="col-lg-4">
                <img id="scissor" onclick="rpsGame(this)"
                    src="data:image/jpeg;base64,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"
                    alt="">

            </div>
        </div>
    </div>

    <script src="index.js" async defer></script>
</body>

JS 这里rpsGame是主函数，调用rpsFrontEnd函数，rpsFrontEnd参数正确。

function rpsGame(yourChoice) {


    var humanChoice = yourChoice.id;
    var botChoice = noToChoice(randTorpsInt());  
    console.log("bot choice " + botChoice);
    console.log("your choice " + humanChoice);

    var results = decideWinner(humanChoice, botChoice);
    console.log(results);
    var message = finalMessage(results);
    console.log(message);
    rpsFrontEnd(humanChoice, botChoice, message);

}

这个 rpsFrontend 首先删除所有图像，然后创建一个新的 div 并在其中附加一个 img 但 img 没有被打印

function rpsFrontEnd(humanImageChoice, botImageChoice, finalMessage) {
    var imageDatabase = {
        "rock": document.getElementById("rock").src,
        "paper": document.getElementById("paper").src,
        "scissor": document.getElementById("scissor").src
    }
    document.getElementById("rock").remove();
    document.getElementById("paper").remove();
    document.getElementById("scissor").remove();

    var humanDiv = document.createElement("div");
    var botDiv = document.createElement("div");
    var messageDiv = document.createElement("div");
    

    humanDiv.innerHTML="<img src'"+imageDatabase[humanImageChoice]+"'>";
    console.log(humanDiv);
    document.getElementById("col").appendChild(humanDiv);

}

感谢您的时间！

Answer 1

document.getElementById("row").appendChild(humanDiv);

此行不起作用，因为您的 HTML 中没有带有 ID 行的元素 - 它是一个类，因此 getElementById 找不到它。

改变这个

<div class="row">

到这里

<div id="row">

Answer 2

一小时后我得到了一个很小的错误

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

感谢那些给这里时间的人，innerHtml 中再次缺少等号

将图像附加到 div 未显示

2 个答案: