Вставить Div в другой Div?
Я создаю веб-приложение и хотел бы узнать, почему следующий код не работает. Сначала он создает элемент, который затем добавляется к телу. Затем я создаю еще один элемент Div, который я хотел бы разместить внутри первого созданного мной элемента div.
Я использую классы MooTools для создания и инициализации объектов, и это работает нормально, но я просто не могу заставить работать следующий код. Код находится внутри initialize: function () класса:
this.mainAppDiv = document.createElement("div");
this.mainAppDiv.id = "mainBody";
this.mainAppDiv.style.width = "100%";
this.mainAppDiv.style.height = "80%";
this.mainAppDiv.style.border = "thin red dashed";
document.body.appendChild(this.mainAppDiv); //Inserted the div into <body>
//----------------------------------------------------//
this.mainCanvasDiv = document.createElement("div");
this.mainCanvasDiv.id = "mainCanvas";
this.mainCanvasDiv.style.width = "600px";
this.mainCanvasDiv.style.height = "400px";
this.mainCanvasDiv.style.border = "thin black solid";
document.getElementById(this.mainAppDiv.id).appendChild(this.mainCanvasDiv.id);
Как вы можете видеть, он сначала создает div с именем «mainBody», а затем добавляет к нему document.body. Эта часть кода работает отлично. Проблема возникает из-за создания второго div и попытки вставить его с помощью document.getElementById (this.mainAppDiv.id) .i (this.mainCanvasDiv.id);
Кто-нибудь может придумать причину, по которой приведенный выше код не работает?