Metodo insertAdjacentText
Il metodo insertAdjacentText consente
di inserire una stringa in qualsiasi punto della pagina. La stringa
viene inserita relativamente a un elemento di riferimento.
È possibile effettuare l'inserimento prima dell'elemento di riferimento
(modalità di inserimento 'beforeBegin'), dopo
di esso (modalità di inserimento 'afterEnd'), oppure
all'inizio (modalità di inserimento 'afterBegin')
o alla fine (modalità di inserimento 'beforeEnd')
dell'elemento di riferimento.
Sintassi
elemento di riferimento.insertAdjacentText(modalità di inserimento, testo da inserire);
Esempio . Modalità beforeBegin
Supponiamo che l'elemento di riferimento sia l'elemento #target.
Inseriamo prima di esso del testo:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('beforeBegin', 'testo');
Risultato dell'esecuzione del codice:
testo
<div id="target">
<p>elem</p>
</div>
Esempio . Modalità afterEnd
Ora inseriamo del testo dopo l'elemento di riferimento:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('afterEnd', 'testo');
Risultato dell'esecuzione del codice:
<div id="target">
<p>elem</p>
</div>
testo
Esempio . afterBegin
Inseriamo del testo all'inizio dell'elemento di riferimento:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('afterBegin', 'testo');
Risultato dell'esecuzione del codice:
<div id="target">
testo
<p>elem</p>
</div>
Esempio . Modalità beforeEnd
Inseriamo del testo alla fine dell'elemento di riferimento:
<div id="target">
<p>elem</p>
</div>
let target = document.querySelector('#target');
target.insertAdjacentText('beforeEnd', 'testo');
Risultato dell'esecuzione del codice:
<div id="target">
<p>elem</p>
testo
</div>
Vedi anche
-
metodo
insertAdjacentElement,
che inserisce un elemento in una posizione specificata -
metodo
insertAdjacentHTML,
che inserisce del codice in una posizione specificata -
metodo
prepend,
che inserisce elementi all'inizio -
metodo
append,
che inserisce elementi alla fine -
metodo
appendChild,
che inserisce elementi alla fine del genitore -
metodo
insertBefore,
che inserisce elementi prima di un elemento
