可以't在页面加载Javascript之前添加到DOM内容

Can't add to DOM content before page load Javascript

本文关键字:Javascript 添加 内容 DOM 加载 可以      更新时间:2023-09-26

我目前正试图在从parse查询后使用javscript将一堆元素添加到列表中。

如果我不添加任何点击监听器,我可以获得完整的列表,但是如果我添加了点击监听器,则只有前5项出现在列表中。

这是我的javascript文件中的代码,它首先在html:中被调用

if (!Parse.User.current()){
    window.location.href = 'index.html';
}
else {
    getParticipants();
}
$( document ).ready(function() {

$('#sign-out').click(function(){
    Parse.User.logOut();
    window.location.href = 'index.html';
    });

});

function getParticipants (){
var Participants = Parse.Object.extend("Participants");
var query = new Parse.Query(Participants);
query.ascending("patientID");
query.find({
    success: function(results) {
        for (var i = 0; i < results.length; i++) {
            var object = results[i];
            var id = object.get("patientID");
            $(".list-group").append("<li class='list-group-item' id='" + id + "'>" + id + "</li>");
            (function (id) {
                $('#' + object.get("patientID")).click(function (e) {
                    e.preventDefault();
                    if (typeof(Storage) !== "undefined") {
                        localStorage.setItem("patientID", id);
                    } else {
                        // Sorry! No Web Storage support..
                    }
                    window.location = 'profile.html';
                });
            }(id));
        }
    },
    error: function(error) {
        alert("Error: " + error.code + " " + error.message);
    }
});

}

在页面加载之前,您永远不能修改DOM,因为此时DOM还没有准备好。

任何DOM操作都应该在onload事件被激发之后进行。