Question

我是Javascript和html的初学者。我想输出10＆＃34;嗨＆＃34;但是下面的代码不起作用。我该怎么办？

index.html和app.js位于同一个文件夹中。

的index.html

<html>
<head>
</head>
<body>
<div class = "test"></div>
<script type="text/javascript" src="app.js"></script>
</body>
</html>

app.js

var main = function(){
for(var i = 0; i<10; i++){
    var f = document.createElement('p');
    f.innerText = "Hi.";
    var div = document.getElementByClass('test');
    div.appendChild(f);
};
$(document).ready(main);

Answer 1

查看浏览器的JavaScript错误控制台
请参阅有关$未定义的错误，因此参考错误
定义$（您可能希望通过加入the jQuery library）

或者，只需删除$(document).ready(main);并直接拨打main()即可。你似乎并不需要jQuery。

然后你必须与getElementByClass作为一个功能抗争。请改为getElementsByClassName或querySelector。

Answer 2

首先，你引用jQuery library而不包含它

$(document).ready(main);

添加到jquery库的链接：

<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.2.min.js"></script>

那么你的脚本有一些错误：

尝试使用浏览器的开发者控制台进行调试

您的代码应如下所示：

var main = function(){
    /*no need to exec this for all loops iteration
    and the right method is getElementByClassName not getElementByClass */
    var div = document.getElementByClassName('test')[0];

    for(var i = 0; i<10; i++){
        var f = document.createElement('p');
        f.innerText = "Hi.";    
        div.appendChild(f);
    };
} /*you forgot to close the function*/
$(document).ready(main);

Answer 3

(function () {
    for (var i = 0; i < 10; i++) {
      var f = document.createElement('p'),
          div = document.querySelector('.test');

      f.innerText = 'Hi';
      div.appendChild(f);
    }
})();

Answer 4

有几件事：

您需要包含jQuery库
您的功能缺少结束}
它是getElementsByClassName，而不是getElementByClass
如果它只是一个div，为什么不使用ID呢？像这样：

$(function () {
    for (var i = 0; i < 10; i++) {
        var f = document.createElement('p');
        f.innerText = "Hi.";
        var div = document.getElementById('test');
        div.appendChild(f);
    }
});

jsFiddle

我如何使用JavaScript的HTML？

4 个答案: