Comment puis-je obtenir tous les div du contenu et de l'annexer à un autre div?

J'ai 2 div.

div1 et div2. Je veux obtenir tout le contenu de div1 et de l'annexer à div2 et puis fadeOut div1.

J'ai essayé:

$('#div1').append('#div2');
$('#div1').fadeOut();

$('#div1').appendTo('#div2');
    $('#div1').fadeOut();

$('#div1').html('#div2');
$('#div1').fadeOut();

mais aucune ne semble fonctionner pour moi.

Ce que j'ai fait une erreur?

OriginalL'auteur jQuerybeast | 2012-01-05

append jquery

8

Le problème avec .html() méthodes est qu'elle convertit les éléments du DOM HTML et vice-versa. Vous perdrez tous les gestionnaires d'événements et les données liées à ces éléments.

Utilisation .contenu() ^[docs] à la place:
```
$("#div1").contents().appendTo('#div2').end().fadeOut();
```
ou si vous souhaitez copier le contenu:
```
$("#div1").clone(true, true).contents().appendTo('#div2');
$("#div1").fadeOut();
```
Il est toujours utile de lire la documentation lorsque vous utilisez des méthodes. E. g.
```
$('#div1').append('#div2');
```
ajoute la chaîne #div2 à l'élément avec l'ID div1. La documentation dit:

Insérer du contenu, spécifié par le paramètre, à la fin de chaque élément de l'ensemble des éléments qui correspondent.

et

contenu: élément du DOM, chaîne HTML, jQuery objet à insérer à la fin de chaque élément de l'ensemble des éléments qui correspondent.

Similaires pour $('#div1').html('#div2');:

htmlString: Une chaîne de HTML pour définir le contenu de chaque appariés élément.

Il suffit de remplacer le contenu de #div1 avec la chaîne '#div2'.

De l'autre côté
```
$('#div1').appendTo('#div2');
```
aura pour effet d'ajouter l'élément avec l'ID div1 à l'élément avec l'ID div2:

Insérer tous les éléments de l'ensemble des éléments qui correspondent à la fin de la cible.

Le jQuery documentation est assez bonne, je vous recommande de le lire.

Cela permettra en fait de déplacer le contenu de la #div1 plutôt qu'une simple copie de ce qui peut être bien, mais probablement la peine de mentionner. Cela signifie également que la fadeOut ne peut pas être vu, car le contenu de l'élément est déplacé.
La question ne mentionne que pour obtenir le contenu de a à b. Mais bon, on pourrait utiliser copy.
Ouais, juste pensé qu'il pourrait être intéressant de souligner le fait que, bien que le résultat peut être le même avec ce et le html solution, le DOM sera différent. Cependant, la contents solution ne signifie la fadeOut peut ne pas être visible, car il n'y a rien à gauche de l'élément.
Je vous remercie. Bien expliqué
Vous avez absolument raison, il ne serait pas logique de la fermeture de l'élément s'il n'existe pas de contenu à l'intérieur. Il devrait fonctionner correctement lorsque le clonage le nœud premier. Je vous remercie pour votre participation!

OriginalL'auteur Felix Kling
7

Vous pourriez obtenir le code HTML de #div1 et d'ajouter que pour #div2:
```
$("#div2").append($("#div1").html());
$('#div1').fadeOut();
```
Voici un exemple de travail.

Notez que ceci est similaire à votre troisième exemple, qui n'a pas fonctionné parce que le html méthode prend une chaîne et ajoute les éléments sélectionnés. Dans votre cas, il serait tout simplement d'ajouter la chaîne littérale "#div2". Vous avez besoin d'obtenir le code HTML que vous souhaitez ajouter à partir de #div1, et d'ajouter que.

Également noter que fadeOut cache simplement l'élément (il définit display:none), et ne pas l'enlever de la DOM. Je ne suis pas sûr si c'est ce que vous voulez ou pas.

Sauf si vous voulez remplacer le contenu de div2, auquel cas vous devez remplacer append avec html.
Oui, bien que la question n'dire "annexer à div2".
Simple et sympathique.

OriginalL'auteur James Allardice

C'est un petit exemple pour vous placer au-dessous du texte au format HTML

<div id="div1">
    <p>hi</p>
</div>
<div id="div2"></div>

et le script ci-dessous

$("#div2").append($("#div1").html());
$('#div1').fadeOut();

OriginalL'auteur Murtaza

0
```
content = $('#div1').html();
$('#div2').append(content);
$('#div1').fadeOut();
```
si nous utilisons html() nous permettrait de remplacer le contenu à l'intérieur de div2.

OriginalL'auteur sushil bharwani
0
```
$('#div2').html($('#div2').html());
```
devrait fonctionner.

OriginalL'auteur amiuhle

Vous devez vous connecter pour publier un commentaire.