aboutsummaryrefslogtreecommitdiff
path: root/files/ru/web/api/domimplementation/createhtmldocument/index.html
blob: 51092a034b23ebec6ea891800f1440248ec81504 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
---
title: DOMImplementation.createHTMLDocument()
slug: Web/API/DOMImplementation/createHTMLDocument
tags:
  - API
  - DOM Reference
  - DOMImplementation
  - Method
  - Reference
translation_of: Web/API/DOMImplementation/createHTMLDocument
---
<p>{{ApiRef("DOM")}}</p>

<p><span class="seoSummary">Метод <strong><code>DOMImplementation.createHTMLDocument()</code></strong> создает новый HTML {{ domxref("Document") }}.</span></p>

<h2 id="Синтаксис">Синтаксис</h2>

<pre class="syntaxbox notranslate">const <var>newDoc</var> = document.implementation.createHTMLDocument(<var>title</var>)</pre>

<h3 id="Параметры">Параметры</h3>

<dl>
 <dt><code><var>title</var></code>  {{optional_inline}} (except in IE)</dt>
 <dd>{{domxref("DOMString")}}, содержащий заголовок для создания нового HTML-документа.</dd>
</dl>

<h2 id="Пример">Пример</h2>

<p>В этом примере создается новый HTML-документ и вставляется в {{HTMLElement("iframe")}} текущего документа.</p>

<p>Вот HTML для этого примера:</p>

<pre class="brush: html notranslate">&lt;body&gt;
  &lt;p&gt;Click &lt;a href="javascript:makeDocument()"&gt;here&lt;/a&gt; to create a new document and insert it below.&lt;/p&gt;
  &lt;iframe id="theFrame" src="about:blank" /&gt;
&lt;/body&gt;
</pre>

<p>Реализация JavaScript <code>makeDocument()</code> выглядит следующим образом:</p>

<pre class="brush: js notranslate">function makeDocument() {
  let frame = document.getElementById("theFrame");

  let doc = document.implementation.createHTMLDocument("New Document");
  let p = doc.createElement("p");
  p.innerHTML = "This is a new paragraph.";

  try {
    doc.body.appendChild(p);
  } catch(e) {
    console.log(e);
  }

  // Copy the new HTML document into the frame

  let destDocument = frame.contentDocument;
  let srcNode = doc.documentElement;
  let newNode = destDocument.importNode(srcNode, true);

  destDocument.replaceChild(newNode, destDocument.documentElement);
}
</pre>

<p>Код в строках 4-12 обрабатывает создание нового HTML-документа и вставку в него некоторого содержимого. Строка 4 использует <code>createHTMLDocument()</code> для создания нового HTML-документа, чей {{ HTMLElement("title") }} это <code>"New Document"</code>. Строки 5 и 6 создают новый элемент абзаца с некоторым простым содержимым, а затем строки 8-12 обрабатывают вставку нового абзаца в новый документ.</p>

<p>Строка 16 вытягивает <code>contentDocument</code> фрейма; это документ, в который мы будем вводить новое содержимое. Следующие две строки обрабатывают импорт содержимого нашего нового документа в контекст нового документа. Наконец, строка 20 фактически заменяет содержимое фрейма содержимым нового документа.</p>

<p><a href="/samples/domref/createHTMLDocument.html">Смотреть Видео Примеры</a></p>

<p>Возвращаемый документ предварительно сконструирован со следующим HTML-кодом:</p>

<pre class="brush: html notranslate">&lt;!doctype html&gt;
&lt;html&gt;
&lt;head&gt;
&lt;title&gt;<var>title</var>&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;/body&gt;
&lt;/html&gt;
</pre>

<h2 id="Спецификации">Спецификации</h2>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">Спецификация</th>
   <th scope="col">Статус</th>
   <th scope="col">Комментарий</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>{{SpecName('DOM WHATWG', '#dom-domimplementation-createhtmldocument', 'DOMImplementation.createHTMLDocument')}}</td>
   <td>{{Spec2('DOM WHATWG')}}</td>
   <td>Первоначальное определение.</td>
  </tr>
 </tbody>
</table>

<h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2>



<p>{{Compat("api.DOMImplementation.createHTMLDocument")}}</p>

<h2 id="Смотрите_также">Смотрите также</h2>

<ul>
 <li>Интерфейс {{domxref("DOMImplementation")}}, к которому он принадлежит.</li>
</ul>