files/fr/web/api/document/write/index.html


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

---
title: document.write
slug: Web/API/Document/write
tags:
  - API
  - DOM
  - Document
  - Méthodes
  - Rérérence
translation_of: Web/API/Document/write
---
<p>{{ ApiRef("DOM") }}</p>

<p>Écrit une chaîne de texte dans un document ouvert par <a href="https://developer.mozilla.org/fr/docs/Web/API/Document/open">document.open()</a>.</p>

<div class="note">
<p><strong>Note :</strong> comme <code>document.write</code> écrit <span class="short_text" id="result_box" lang="fr"><span>dans le flux de documents,</span></span> appeler <code>document.write</code> <span id="result_box" lang="fr"><span>sur un document fermé (chargé) appelle automatiquement <code>document.open</code>, ce qui efface le document.</span></span></p>
</div>

<h2 id="Syntaxe" name="Syntaxe">Syntaxe</h2>

<pre class="eval">document.write(<em>balisage</em>);
</pre>

<h3 id="Paramètres">Paramètres</h3>

<dl>
 <dt><code>markup</code></dt>
 <dd>est une chaîne de caractères contenant le texte à écrire dans le document.</dd>
</dl>

<h3 id="Exemple" name="Exemple">Exemple</h3>

<pre>&lt;html&gt;

&lt;head&gt;
&lt;title&gt;Exemple de document.write&lt;/title&gt;

&lt;script type="text/javascript"&gt;

function nouveauContenu()
{
alert("chargement du nouveau contenu");
document.open();
document.write("&lt;h1&gt;Assez de l'ancien contenu, passons au nouveau !&lt;/h1&gt;");
document.close();
}

&lt;/script&gt;
&lt;/head&gt;

&lt;body onload="nouveauContenu();"&gt;
&lt;p&gt;Ceci est le contenu original du document.&lt;/p&gt;
&lt;/body&gt;
&lt;/html&gt;
</pre>

<h2 id="Notes" name="Notes">Notes</h2>

<p>Écrire dans un document qui a déjà été chargé sans appeler <a href="https://developer.mozilla.org/fr/docs/Web/API/Document/open">document.open()</a> provoquera un appel automatique à <code>document.open</code>. Une fois l'écriture terminée, il est recommandé d'appeler <a href="https://developer.mozilla.org/fr/docs/Web/API/Document/close">document.close()</a> pour indiquer au navigateur qu'il peut terminer de charger la page. Le texte fourni est analysé et intégré à la structure du modèle de document. Dans l'exemple ci-dessus, l'élément <code>h1</code> devient un nœud dans le document.</p>

<p>Si l'appel à <code>document.write()</code> est intégré directement dans le code HTML, il n'appellera pas <code>document.open()</code>. Par exemple :</p>

<pre class="brush: html line-numbers  language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;</span>script</span><span class="punctuation token">&gt;</span></span><span class="language-javascript script token">
  document<span class="punctuation token">.</span><span class="function token">write</span><span class="punctuation token">(</span><span class="string token">"&lt;h1&gt;Main title&lt;/h1&gt;"</span><span class="punctuation token">)</span>
</span><span class="tag token"><span class="tag token"><span class="punctuation token">&lt;/</span>script</span><span class="punctuation token">&gt;</span></span></code></pre>

<div class="note">
<p><strong>Note :</strong> <code>document.write</code> et <code>document.writeln <a href="https://developer.mozilla.org/fr/docs/Archive/Web/Writing_JavaScript_for_HTML">ne fonctionnent pas dans les documents XHTML</a> (vous obtiendrez une erreur </code> "Operation is not supported" [<code>NS_ERROR_DOM_NOT_SUPPORTED_ERR</code>] dans la console d'erreurs). Cela arrive lors de l'ouverture d'un fichier local avec l'extension de fichier  .xhtm ou pour tout document servi avec une  <code>application/xhtml+xml</code> de <a href="https://developer.mozilla.org/fr/docs/Glossaire/Type_MIME">type MIME</a>. Plus d'informations disponibles dans la   <a class="external external-icon" href="http://www.w3.org/MarkUp/2004/xhtml-faq#docwrite">foire aux questions W3C XHTML (en)</a>.</p>
</div>

<div class="note">
<p><strong>Note :</strong> <code>document.write</code> dans les scripts <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#attr-defer">deferred (<em>différé</em>)</a> ou <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script#attr-async">asynchronous (<em>asynchrone</em>)</a> sera ignoré et vous recevrez un message comme  "A call to <code>document.write()</code> from an asynchronously-loaded external script was ignored" dans la console d'erreurs.</p>
</div>

<div class="note">
<p><strong>Note :</strong> Dans Edge seulement, appeler plusieurs fois <code>document.write</code> dans un "iframe" déclenche une erreur "SCRIPT70: Permission denied." <em>(autorisation refusée)</em>.</p>
</div>

<div class="note">
<p><strong>Note :</strong> <span id="result_box" lang="fr"><span>À partir de la version 55, Chrome n'exécute pas les éléments <code>&lt;script&gt;</code> injectés via <code>document.write()</code> en cas d'échec de cache HTTP pour les utilisateurs sur une connexion 2G.</span></span></p>
</div>

<h2 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h2>

<ul>
 <li><a class="external external-icon" href="http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-75233634">DOM Level 2 HTML: <code>write()</code> Method</a></li>
 <li><a class="external external-icon" href="http://www.w3.org/TR/2011/WD-html5-author-20110705/apis-in-html-documents.html#dynamic-markup-insertion">Dynamic markup insertion in HTML</a></li>
</ul>

<h2 id="Voir_aussi">Voir aussi</h2>

<ul>
 <li>{{ domxref("element.innerHTML") }}</li>
 <li>{{ domxref("document.createElement()") }}</li>
</ul>