Método before
El método before agrega texto antes del elemento
especificado. También existe el método
insertBefore,
que funciona de manera similar.
Sintaxis
Insertar texto antes del elemento:
$(selector).before(texto);
Así es como se agregará texto antes de los elementos seleccionados, que será devuelto por la función personalizada:
$(selector).before(function(número en el conjunto));
Otra variante de uso de la función, donde el segundo parámetro establece el valor html anterior del elemento:
$(selector).before(function(número en el conjunto, cadena html));
El texto también puede ser no solo texto plano, sino también un elemento DOM o un objeto jQuery. En este caso, estos elementos se moverán desde su posición en el código HTML.
Ejemplo
Insertemos texto antes del párrafo especificado:
<p id="test">texto</p>
$('#test').before('!!!');
El código HTML quedará así:
!!!<p id="test">texto</p>
Ejemplo
Insertemos texto con etiquetas antes del párrafo especificado:
<p id="test">texto</p>
$('#test').before('<p>!!!</p>');
El código HTML quedará así:
<p>!!!</p><p id="test">texto</p>
Ejemplo
Pongamos un párrafo encima del otro (es decir, cortemos el párrafo de su posición anterior y coloquémoslo en una nueva):
<p id="p1">texto1</p>
<p id="p2">texto2</p>
$('#p2').before('#p1');
El código HTML quedará así:
<p id="p2">texto2</p>
<p id="p1">texto1</p>
Véase también
-
método
insertBefore,
que agrega texto antes del elemento especificado -
métodos
after,append,prepend,
que permiten agregar contenido en un lugar específico de la página -
método
clone,
que crea copias de los elementos seleccionados
