Почему я не могу назначить тело динамически созданного HTML-документа? - PullRequest
0 голосов
/ 23 июня 2019

Я пытаюсь динамически создать html-объект документа в javascript и связать его с кнопкой на странице.Однако, когда я запускаю приведенный ниже код, я получаю следующую ошибку: «TypeError: Атрибут Document.body должен быть экземпляром HTMLElement».Документация MDN Web API гласит: «В документе HTML метод document.createElement () создает элемент HTML, указанный в tagName».Почему тогда я получаю эту ошибку?Как я могу создать HTML-документ динамически?

window.onload = function() {
    var new_document = new Document();
    var new_body = new_document.createElement("body");
    new_document.body = new_body;
}

1 Ответ

2 голосов
/ 24 июня 2019

На этот вопрос ответили. Как создавать объекты Document с помощью JavaScript

Ознакомьтесь с MDN, чтобы узнать, как https://developer.mozilla.org/en-US/docs/Web/API/DOMImplementation/createHTMLDocument

Новый конструктор Document () не используется таким образом.Вы можете найти причину, по которой вы получаете эту ошибку, если вы используете консоль в своем браузере ...


let doc = new Document();
doc.body;
// < null
doc.doctype;
// < null
// doc.doctype is a read only property also.
doc.__proto__;
// < Document {…}

// ‘document’ is the document the browser already created.

document.doctype;
// < “<!doctype html>“
document.__proto__;
//HTMLDocument {constructor: ƒ, Symbol(Symbol.toStringTag): "HTMLDocument"}

let body1 = doc.createElement('body');
let body = document.createElement('body');

body1.__proto__;
// Element {…}
body.__proto__;
// < HTMLBodyElement {…}

doc.body = body1;
// < Type Error: Not of type HTMLElement

// Now use the body element created by 'document'.

doc.body = body;
// Uncaught DOMException: Failed to set the 'body' property on 'Document': No document element exists.

// The body needs an document element to become a child node of.

let html = document.createElement('html');
doc.appendChild(html);
doc.body = body;
// No errors

doc.body;
// <body></body>


Как мы видим, новый конструктор Document () создает полностью пустой Document с прототипом Document,И когда вы создаете из него элементы, у этих элементов есть прототип Element.

Document, созданный браузером с именем document, имеет прототип HTMLDocument, а элементы, которые он создает, имеют прототипы HTMLElement.И это то, что ищет сеттер из doc.body.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...