Я пытаюсь добавить элемент div в мой контейнер верхнего уровня div, но по какой-то причине я получаю сообщение об ошибке.
Вот мой код. Это кнопка, которая, как только вы нажимаете, должна добавить окно на экране.
Чтобы избежать ошибки jQuery с this.
, Я определил переменную поверх моего класса, называемую self
var self = this;
Таким образом, это исправляет ошибку jQuery.
$(this.button).click(function() {
self.newContainer = new divGenerator();
self.containerDiv.parentNode.appendChild(self.newContainer.divContainer);
});
Что действительно странно, когда я распечатываю
console.log("self.newContainer: "+self.newContainer.containerDiv);
В результате я получаю " self.newContainer: [object HTMLDivElement]
". И HTMLDivElement - это именно то, что мне нужно, не так ли? Это узел, а appendChild() - элемент узла. Так что все кажется правильным. Но это не так. Зачем?
Мне кажется (и я, возможно, читаю это неправильно, вам нужно было бы опубликовать внутренности divGenerator, чтобы я был уверен), что ваша проблема - просто ошибка именования... опечатка, если хотите. В следующей строке:
self.containerDiv.parentNode.appendChild(self.newContainer.divContainer);
Я замечаю, что вы вызываете divContainer
а не containerDiv
на self.newContainer
. Если у вас также нет свойства, определенного как divContainer
, я предполагаю, что вам просто нужно изменить имя вашего вызова свойства как containerDiv
, как это имеет место в остальной части вашего кода.
Боковая панель: я заметил, что вы упоминаете
Чтобы избежать ошибок JQuery с
this
, я определил переменный в верхней части моего класса, который называетсяself
Насколько я знаю, в jQuery нет такой "ошибки". Скорее, вы испытываете путаницу в отношении использования this
, что является ключевым словом, ссылающимся на текущий контекст функции (т.е. На объект, в котором вы сейчас работаете).
Ваше решение, по сути, является распространенной идиомой в JavaScript, что позволяет ссылаться на охватывающий контекст с помощью переменной, назначенной this
во внешней области. Я рекомендую прочитать эту статью, чтобы прояснить ваше понимание this
конструкции и как ее можно и нужно использовать.
this.button
?this.button = document.createElement("button");