jQuery: ¿Cómo obtener el elemento wrapper creado con "wrapAll()"?

Question

jQuery: ¿Cómo obtener el elemento wrapper creado con "wrapAll()"?

Considere el siguiente código: (ejemplo en vivo aquí)

HTML:

<div class="a">Hello</div>
<div class="a">Stack</div>
<div class="a">Overflow</div>

CSS:

.wrapper {
    background-color: #777;
}

JS:

$(function() {
    var wrapper = $("<div class='wrapper'></div>");
    $(".a").wrapAll(wrapper);
    wrapper.css("border", "5px solid black"); // Doesn't work
});

¿Cuál sería la forma correcta de obtener el wrapper creado y cambiar sus atributos ?

Nota: Hay otros elementos .wrapper en el DOM, así que esto no funcionará:

$(".wrapper").css("border", "5px solid black");

Tampoco quiero dar un id único a la envoltura creada.

23

javascript jquery wrapping wrap wrapall

Author: Misha Moroshko, 2011-08-07

Source

3 answers

El objeto jQuery almacenado en wrapper se clona cuando se llama a wrapAll, por lo que no puede afectar a los .wrappers que se han insertado en el DOM manipulando wrapper, debe seleccionarlos del documento.

6

Author: karim79,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2011-08-07 12:44:43

$(function() {
    var wrapper = $("<div class='wrapper'></div>");
    var wrapped = $(".a").wrapAll(wrapper);
    wrapped.css("border", "5px solid black");
});

-2

Author: Billy Moon,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2011-08-07 12:38:21

score 31 · Accepted Answer

Dado que acaba de empaquetar los elementos, puede usar parent () para obtener los envoltorios recién insertados:

$(".a").wrapAll("<div class='wrapper'></div>")
       .parent().css("border", "5px solid black");

31

Author: Frédéric Hamidi,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2011-08-07 12:47:25