Я сбит с толку, внезапно мои console.log
сообщения исчезли, когда я пытался отладить проблему, которую я не решил.Исходная проблема заключается в том, что кажется, что весь мой код инициализации выполняется и заполняет элементы html div
, подготавливаясь к тому, когда элементы заполняются в контейнер.Когда код доходит до заполнения контейнера, он говорит:
Unhandled Promise Rejection: TypeError: Argument 1 ('node') to Document.importNode must be an instance of Node
Этот код вызывает ошибку:
this.populate = function() {
var pop_container = document.querySelector("#pool>#container");
console.log("pop_container: "+JSON.stringify(pop_container));
this.createBoxes(pop_container).then(function(container) {
console.log("container: "+JSON.stringify(container));
var targetContainer = document.querySelector(".app");
targetContainer.innerHTML = "";
targetContainer.appendChild(document.importNode(container, true));
});
};
По какой-то причине я не вижулюбые console.log
сообщения.Я изменил их все на оповещения, и они отображаются как оповещения - так что я вижу, что поток программы, кажется, выполняется правильно.
Почему исчезли мои сообщения console.log (я отлаживаю с помощью Safari
)?
ОБНОВЛЕНИЕ
Ошибка связана с моей функцией createBoxes
, потому что ясделал это:
this.createBoxes(pop_container).then(function(container) {
console.log("container: "+JSON.stringify(container));
var targetContainer = document.querySelector(".app");
targetContainer.innerHTML = ""; targetContainer.appendChild(document.importNode(document.querySelector("#pool>#container"), true));
});
и он нашел все элементы и заселил их.Я хотел бы знать, что не так с моей createBoxes
функцией (что она возвращает non-node
), вот она:
this.createBoxes = async function(pool_var) {
//var row_counter = 0;
for (var i = 1; (i * this.total_rows) < (9 * this.total_rows); i++) {
var item_box = document.createElement("div");
item_box.style.flex = "1 0 50%";
item_box.style.display = "flex";
item_box.style.flexDirection = "column";
item_box.style.justifyContent = "flex-end";
item_box.style.borderBottom="2px solid #9a9a9a";
item_box.style.background = "no-repeat center/100% url("+this.fake_data[i - 1].pic+")";
item_box.id = "item_box_"+this.total_boxes;
var colors = ["#e0e0e0", "#bfbfbf"];
var item_name = document.createElement("h3");
item_name.style.display = "flex";
item_name.style.flex = "0.11 0";
item_name.style.width = "100%";
item_name.style.backgroundColor = (i % 2 == 0 ? colors[0] : colors[1]);
item_name.style.justifyContent = "center";
item_name.style.alignItems = "center";
item_name.style.margin = "0em 0em 0em 0em";
item_name.innerText = this.fake_data[i - 1].name;
item_name.id = "item_name_"+this.total_boxes;
item_box.appendChild(item_name);
var this_row = document.getElementsByClassName("row")[this.total_rows - 1];
this_row.appendChild(item_box);
this.total_boxes++;
console.log("total_boxes: "+this.total_boxes);
console.log("i: "+i);
if(i % 2 == 0) {
var inner_row = document.createElement("div");
inner_row.style.display = "flex";
inner_row.style.flexDirection = "row";
inner_row.style.flex = "1 0 200px";
inner_row.style.backgroundColor = "green";
inner_row.className = "row";
pool_var.appendChild(inner_row);
//row_counter++;
this.total_rows++;
console.log("this_total_rows: "+this.total_rows);
}
else if(i == 8) {
console.log("entered ending else if");
return pool_var;
}
}
}
ТАКЖЕ , я все еще могу 'console.log
сообщений!
ОБНОВЛЕНИЕ
console
сообщений не показывалось, потому что у меня оно было на вкладке Errors
only в консоли safari
,переключился на All
, не знаю, как он вообще переключился ... все еще интересуюсь моей функцией createBoxes
.