diff options
Diffstat (limited to 'files/it/web/api/element/insertadjacenthtml/index.html')
| -rw-r--r-- | files/it/web/api/element/insertadjacenthtml/index.html | 102 |
1 files changed, 0 insertions, 102 deletions
diff --git a/files/it/web/api/element/insertadjacenthtml/index.html b/files/it/web/api/element/insertadjacenthtml/index.html deleted file mode 100644 index f69fbb1daf..0000000000 --- a/files/it/web/api/element/insertadjacenthtml/index.html +++ /dev/null @@ -1,102 +0,0 @@ ---- -title: Element.insertAdjacentHTML() -slug: Web/API/Element/insertAdjacentHTML -tags: - - API - - Cambiare il DOM - - DOM - - Element - - HTML - - Inserire elementi - - Inserire nodi - - Referenza - - insertAdjacentHTML - - metodo -translation_of: Web/API/Element/insertAdjacentHTML ---- -<div>{{APIRef("DOM")}}</div> - -<p>Il metodo <strong><code>insertAdjacentHTML()</code></strong> dell'interfaccia {{domxref("Element")}} analizza il testo specificato come HTML o XML e inserisce i nodi risultanti nell'albero DOM in una posizione specificata. Non esegue il reparse dell'elemento su cui viene utilizzato, e quindi non corrompe gli elementi esistenti all'interno di quell'elemento. Questo evita il passaggio extra della serializzazione, rendendolo molto più veloce della manipolazione diretta di {{domxref("Element.innerHTML", "innerHTML")}}.</p> - -<h2 id="Sintassi">Sintassi</h2> - -<pre class="syntaxbox"><em>element</em>.insertAdjacentHTML(<em>position</em>, <em>text</em>);</pre> - -<h3 id="Parametri">Parametri</h3> - -<dl> - <dt><code>position</code></dt> - <dd>Una {{domxref("DOMString")}} che rappresenta la posizione relativa ad <code>element</code>; deve essere una delle seguenti stringhe: - <ul> - <li><code style="color: red;">'beforebegin'</code>: Davanti ad <code>element</code> stesso.</li> - <li><code style="color: green;">'afterbegin'</code>: Appena dentro <code>element</code>, prima del suo primo figlio.</li> - <li><code style="color: blue;">'beforeend'</code>: Appena dentro <code>element</code>, prima del suo ultimo figlio.</li> - <li><code style="color: magenta;">'afterend'</code>: Dopo ad <code>element</code> stesso.</li> - </ul> - </dd> - <dt><code>text</code></dt> - <dd>La stringa da analizzare come HTML o XML e inserita nell'albero.</dd> -</dl> - -<h3 id="Visualizzazione_dei_nomi_delle_posizioni">Visualizzazione dei nomi delle posizioni</h3> - -<pre><!-- <strong><code style="color: red;">beforebegin</code></strong> --> -<code style="font-weight: bold;"><p></code> - <!-- <strong><code style="color: green;">afterbegin</code></strong> --> - foo - <!-- <strong><code style="color: blue;">beforeend</code></strong> --> -<code style="font-weight: bold;"></p></code> -<!-- <strong><code style="color: magenta;">afterend</code></strong> --></pre> - -<div class="note"><strong>Note: </strong> Le posizioni <code>beforebegin</code> e <code>afterend</code> funzionano solo se il nodo si trova nell'albero del DOM e ha un elemento padre.</div> - -<h2 id="Esempio">Esempio</h2> - -<pre class="brush: js">// <div id="one">one</div> -var d1 = document.getElementById('one'); -d1.insertAdjacentHTML('afterend', '<div id="two">two</div>'); - -// A questo punto, la nuova struttura è: -// <div id="one">one</div><div id="two">two</div></pre> - -<h2 id="Note">Note</h2> - -<h3 id="Considerazioni_sulla_sicurezza">Considerazioni sulla sicurezza</h3> - -<p>Quando si inserisce HTML in una pagina utilizzando <code>insertAdjacentHTML()</code>, fare attenzione a non utilizzare l'input dell'utente che non è stato analizzato.</p> - -<p>Non è consigliabile utilizzare <code>insertAdjacentHTML()</code> quando si inserisce testo normale; usa invece la proprietà {{domxref("Node.textContent")}} o il metodo {{domxref("Element.insertAdjacentText()")}}. Questo non interpreta il contenuto passato come HTML, ma invece lo inserisce come testo non elaborato.</p> - -<h2 id="Specifiche">Specifiche</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Specifica</th> - <th scope="col">Stato</th> - <th scope="col">Commento</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('DOM Parsing', '#widl-Element-insertAdjacentHTML-void-DOMString-position-DOMString-text', 'Element.insertAdjacentHTML()')}}</td> - <td>{{ Spec2('DOM Parsing') }}</td> - <td> </td> - </tr> - </tbody> -</table> - -<h2 id="Compatibilità_con_i_browser">Compatibilità con i browser</h2> - - - -<p>{{Compat("api.Element.insertAdjacentHTML")}}</p> - -<h2 id="Vedi_anche">Vedi anche</h2> - -<ul> - <li>{{domxref("Element.insertAdjacentElement()")}}</li> - <li>{{domxref("Element.insertAdjacentText()")}}</li> - <li>{{domxref("XMLSerializer")}}: Costruire una rappresentazione DOM del testo XML</li> - <li><a class="external" href="https://hacks.mozilla.org/2011/11/insertadjacenthtml-enables-faster-html-snippet-injection/">hacks.mozilla.org guest post</a><span class="external"> di Henri Sivonen, incluso benchmark che mostra che insertAdjacentHTML può essere molto più veloce in alcuni casi.</span></li> -</ul> |