Question

所以这是我的代码，它不会让smile.png出现...... 但是，如果我取消注释div id leftSide中的直接源，它可以工作，但不能通过dom appendChild，我正在尝试将一些图像添加到名为leftSide的第一个div中。

由于

    <!DOCTYPE html>
<html>
<head>
    <title>Color Guessing Game</title>
    <style type="text/css">
    #wrapper {width: 1200px;
                border: 1px solid black;}

    #leftSide {height: 500px;
                width: 500px;
                border: dotted;
                border-right-style: dotted;
                float: left;
            }

    #rightSide {height: 500px;
                width: 500px;
                border: dashed;
                overflow: hidden;
                }
    </style>

    <script>

    function matchingGame() {

        var newImg = document.createElement("img");
        newImg.src = "smile.png";
        var imgPart = document.getElementsById("leftSide");
        imgPart.appendChild(newImg);
    }

    </script>
</head>
<body onload="matchingGame()">

<p>Click on the extras smiling face on the left.</p>

<div id="wrapper">
<div id="leftSide">
    <!-- <img src="smile.png">
    <img src="http://home.cse.ust.hk/~rossiter/mooc/matching_game/smile.png"> -->
</div>

<div id="rightSide"></div>
</div>
</body>
</html>

dom节点添加图像appendChild将无法正常工作

0 个答案: