用户填写提示后,如何让输出显示在 div 内?

How do I get the output to display inside the div after the user fills in the prompts?

当我在浏览器中测试这段代码时,弹出的提示很好,但是在全部填写后屏幕上什么也没有。有什么我想念的吗...?

<!DOCTYPE html>
<html>
    <head>
        <title>Mad Libs</title>
    </head>
    <body>
    <div id="out"></div>
        <script>
        var properName = prompt("Enter a proper name");
        var verb = prompt("Enter a verb (past tense)");
        var verb2 = prompt("Enter a second verb (past tense)");
        var adj = prompt("Enter an adjective");
        var adj2 = prompt("Enter another adjective");

        var out = "Roses are red. Violets are blue. <br/>";
        out += properName + "left town without wearing a shoe. <br/>";
        out += properName + " " + verb + "<br/>";
        out += "And " + properName + " " + verb2 + "<br/>";
        out += "But I am " + adj + " " + properName + "thought. <br/>";
        out += "And kind of " + adj2 + " too!";
            
        document.getElementByID('out').innerHTML = out;
        </script>
    </body>
</html>

document.getElementByID 应该是 document.getElementById:

<!DOCTYPE html>
<html>
    <head>
        <title>Mad Libs</title>
    </head>
    <body>
    <div id="out"></div>
        <script>
        var properName = prompt("Enter a proper name");
        var verb = prompt("Enter a verb (past tense)");
        var verb2 = prompt("Enter a second verb (past tense)");
        var adj = prompt("Enter an adjective");
        var adj2 = prompt("Enter another adjective");

        var out = "Roses are red. Violets are blue. <br/>";
        out += properName + "left town without wearing a shoe. <br/>";
        out += properName + " " + verb + "<br/>";
        out += "And " + properName + " " + verb2 + "<br/>";
        out += "But I am " + adj + " " + properName + "thought. <br/>";
        out += "And kind of " + adj2 + " too!";
            
        document.getElementById('out').innerHTML = out;
        </script>
    </body>
</html>