将jQuery对象数组附加到另​​一个jQuery节点

Question

在jQuery的1.3.2版中，以下工作：

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

似乎在jQuery 1.4.2中，$（[...]）无声地失败。我需要这个代码兼容两个版本的jQuery，因为我们的单元测试被迫运行1.3.2，但主应用程序使用jQuery 1.4.2。有什么想法吗？

Answer 1

尝试使用.get(0)来获取要添加到数组中的实际元素。似乎工作：

试一试： http://jsfiddle.net/TFY22/

（您可以在jsFiddle左侧切换jQuery版本，然后点击顶部的运行。）

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);

---

编辑：关于以下评论，有更简单的方法。

这将立即创建整个结构。

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

如果要包含任何动态数据，可以将其连接起来，只要知道如果数据源未知就存在安全问题。

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

var text = 'foo';

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

或采取更冗长的方法，并分别创建每个元素，并附加：

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);

或链接.append()来电，以提供结构化外观：

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);​