Question

好吧，我已经有很长一段时间没有使用过JQuery了......但是，随着编码的进行，我不得不做一个项目，我无法确定是否提供了JQuery。

我正在尝试做的事情是使用JQuery：

$(document).ready(function() {
    $('#myDiv').append('<ul><li>a</li><li>b</li></ul>');
});

现在对非jquery的事情，这就是我所拥有的，我真的无法理解为什么它不起作用：

<html>
    <head>
        <script type="text/javascript">
            function load() {
                var s = '<ul><li>a</li><li>b</li></ul>'; 
                var element = document.getElementById("myDiv");
                element.innerHtml += s;
            }
        </script>
    </head>
    <body onload="load()">
        <div id="myDiv"></div>
    </body>
</html>

事情是，没有任何事情发生（虽然函数被调用）。可能是在调用load（）时DOM没有准备好吗？我依稀记得这个代码在firefox 2.x IE7时代工作......

（a）正确的解决方案是什么？

Answer 1

innerHTML而不是innerHtml。注意大写HTML。改变它，它应该工作正常！这是一个working example。

通过使用innerHtml，您只需在元素对象上创建一个新属性，并为其赋予s的值。

Answer 2

<html>
    <head>
        <script type="text/javascript">
            function load() {
                var s = '<ul><li>a</li><li>b</li></ul>';
                var element = document.getElementById("myDiv");
                element.innerHTML += s;
            }
        </script>
    </head>
    <body onload="load()">
        <div id="myDiv"></div>
    </body>
</html>

JS区分大小写

Answer 3

我想你想要element.innerHTML += s;。

使用（无框架）javascript操作DOM

3 个答案: