jQuery es una biblioteca de Javascript para facilitar la tarea de los desarrolladores web. Los desarrolladores pueden usar la biblioteca Jquery en lugar de usar Javascript en su código. Jquery proporciona muchas funciones buenas, como la manipulación de DOM, el manejo de eventos, la compatibilidad con AJAX, etc.
Se recomienda encarecidamente aprender los conceptos básicos de HTML, CSS y Javascript antes de aprender Jquery.
Enfoque: Puede insertar un objeto jQuery antes de todos los párrafos usando el método llamado . antes() .
-
before() : este método se usa para insertar contenido especificado por el parámetro, antes de cada elemento en el conjunto de elementos coincidentes. Puede aceptar cualquier número de argumentos adicionales como – .prepend() y .after().
-
isnertBefore() : es similar a la función anterior pero el contenido precede al método y se inserta antes del destino, que a su vez se pasa como argumento del método .insertBefore().
Sintaxis:
$(target).before(contentToBeInserted). $(contentToBeInserted).insertBefore(target).
Ejemplo:
HTML
<!DOCTYPE html>
<html>
<head>
<script src=
"https://code.jquery.com/jquery-git.js">
</script>
<meta charset="utf-8" />
<meta name="viewport"
content="width=device-width" />
<style type="text/css">
button {
display: block;
margin: 20px 0 0 0;
}
</style>
</head>
<body>
<h1 style="color: green;">
GeeksforGeeks
</h1>
<h3>
How to insert a jQuery object before
all paragraphs using jQuery?
</h3>
<p>PHP Tutorial</p>
<p>Python Tutorial</p>
<p>Java Tutorial</p>
<button id="button1">
Click to see the effect
</button>
<script>
$("#button1").click(function () {
$("p").before("<i>GeeksForGeeks.com</i>");
});
</script>
</body>
</html>
Producción:
-
Antes de hacer clic: en el elemento del cuerpo, tenemos inicialmente 3 párrafos diferentes llamados: tutorial de PHP, tutorial de Python y tutorial de Java.
-
Después de hacer clic: después de hacer clic en el botón, ahora puede notar que GeeksForGeeks.com se inserta antes de cada párrafo.
Publicación traducida automáticamente
Artículo escrito por krishnanand3 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA