Annexer un tableau d'objets jQuery à un autre noeud jQuery

Question

Dans la version 1.3.2 de jQuery, les travaux suivants:

$('<span/>').append(
    $([ 
    $('<span/>').append(
     $('<a>').attr('href', 'http://google.com').text('Google') 
    ), 
    $('<span/>').text('Foo') 
    ]) 
) 

Il semble que dans jQuery 1.4.2, le $ ([...]) échoue silencieusement. J'ai besoin que ce code soit compatible avec les deux versions de jQuery car nos tests unitaires sont forcés à fonctionner en version 1.3.2, mais l'application principale utilise jQuery 1.4.2. Des idées?

Answer 1

Essayez d'utiliser .get(0) pour récupérer l'élément réel à ajouter à la baie. Semble travailler:

Essayez-:http://jsfiddle.net/TFY22/

(Vous pouvez changer la version jQuery à gauche dans jsFiddle, puis cliquez sur Exécuter en haut.)

var test = $('<span/>').append(
    $([ 
    $('<span/>').append(
     $('<a>').attr('href', 'http://google.com').text('foo') 
    ).get(0), // Get DOM element 
    $('<span/>').text('Google').get(0)// Get DOM element 
    ]) 
); 

$('body').append(test); 

---

EDIT: En ce qui concerne les commentaires ci-dessous, il existe des approches plus simples.

Cela va créer toute la structure à la fois.

$('<span><span><a href="http://google.com">foo</a></span><span>Google</span></span>'); 

Si vous avez des données dynamiques pour inclure, vous pouvez concaténer dans, juste être conscient qu'il ya des problèmes de sécurité si la source des données est inconnue.

http://jsfiddle.net/TFY22/1/

var text = 'foo'; 

$('<span><span><a href="http://google.com">' + text + 
           '</a></span><span>Google</span></span>'); 

Ou adopter une approche plus détaillée, et de créer chaque élément séparément, et ajoutez:

http://jsfiddle.net/TFY22/2/

var $top = $('<span/>'); 
var $a = $('<a/>').attr('href','http://google.com').text('foo'); 

$('<span/>').append($a).appendTo($top); 
$('<span/>').text('Google').appendTo($top); 

ou une chaîne vos .append() appels pour donner un aspect structuré :

http://jsfiddle.net/TFY22/4/

var test = $('<span/>') 
    .append($('<span/>') 
      .append($('<a>').attr('href', 'http://google.com').text('foo')) 
      ) 
    .append($('<span/>').text('Google')); 

$('body').append(test);​