Metodo prepend

Il metodo prepend aggiunge testo all'inizio dell'elemento. Esiste anche il metodo prependTo, che funziona in modo analogo.

Sintassi

Inserimento di testo all'inizio di un elemento:

javascript$(selettore).prepend(testo);

All'inizio degli elementi selezionati è possibile aggiungere testo che verrà restituito da una funzione personalizzata. La funzione viene chiamata separatamente per ciascuno degli elementi selezionati. Quando viene chiamata, le vengono passati i seguenti parametri: la posizione dell'elemento nel set, il contenuto attuale dell'elemento:

javascript$(selettore).prepend(function(numero nel set, contenuto attuale dell'elemento));

Il contenuto può essere non solo testo normale ma anche un elemento DOM o un oggetto jQuery. In questo caso, questi elementi verranno spostati dalla loro posizione nel codice HTML.

Esempio

Inseriamo del testo all'inizio del paragrafo specificato:

html<p id="test">testo</p>
javascript$('#test').prepend('!!!');

Il codice HTML diventerà così:

html<p id="test">!!!testo</p>

Esempio

Inseriamo del testo con tag all'inizio del paragrafo specificato:

html<p id="test">testo</p>
javascript$('#test').prepend('<b>!!!</b>');

Il codice HTML diventerà così:

html<p id="test"><b>!!!</b>testo</p>

Esempio

Troviamo tutti i paragrafi e all'inizio di ciascuno di essi inseriamo il suo numero d'ordine nel set:

html<p>testo</p>
<p>testo</p>
<p>testo</p>
<p>testo</p>
<p>testo</p>
javascript$('p').prepend(function(index, text) {
  return index;
});

Il codice HTML diventerà così:

html<p>0testo</p>
<p>1testo</p>
<p>2testo</p>
<p>3testo</p>
<p>4testo</p>

Vedi anche

  • metodo prependTo,
    che aggiunge testo all'inizio di un elemento
  • metodi append, before, after,
    che consentono di aggiungere contenuto in una posizione specifica
  • pseudoelemento before,
    che aggiunge testo alla fine di un elemento con CSS