El método .add() de jQuery se utiliza para añadir elementos al conjunto de elementos seleccionados. Esto es útil cuando deseas combinar la selección actual con otros elementos del DOM, permitiendo realizar operaciones en un grupo extendido de elementos.
Definición:
El método .add() agrega elementos al conjunto de elementos seleccionados, basándose en un selector, un elemento, o un conjunto de elementos.
Sintaxis:
$(selector).add(selector, context)selector: Un selector de jQuery que especifica los elementos que se agregarán al conjunto de elementos seleccionados.context(opcional): Un contexto adicional en el que se buscarán los elementos.
Ejemplo.
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ejemplo de .add() en jQuery</title>
<style>
.resaltado {
background-color: yellow;
}
.nuevo {
color: green;
}
</style>
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script>
$(document).ready(function(){
$("#botonAgregar").click(function(){
$(".original").add(".adicional").addClass("resaltado");
});
});
</script>
</head>
<body>
<button id="botonAgregar">Agregar Estilo</button>
<div class="original">Elemento original 1</div>
<div class="original">Elemento original 2</div>
<div class="adicional">Elemento adicional</div>
</body>
</html>$(".original").add(".adicional").addClass("resaltado");Explicación del ejemplo:
En este ejemplo, cuando el usuario hace clic en el botón con el id “botonAgregar”, el método .add() combina los elementos con la clase “original” y los elementos con la clase “adicional”. Luego, el método .addClass("resaltado") se aplica a todos esos elementos combinados, cambiando su fondo a amarillo.
Resultado.
Contenido Relacionado.
.addClass()
.addClass() de jQuery agrega clases CSS a los elementos seleccionados, permitiendo aplicar estilos específicos sin modificar el HTML o CSS existente.
Leer más
