Question

var a = $('<div id="a" />');
a.before($('<div id="b" />'));
console.log(a);

为什么我看到[<div id="a"></div>]而不是[<div id="b"></div>,<div id="a"></div>]？

如何在a变量中获得预期结果（2个对象）？

Sample on jsfiddle

UPD ：

我已经拥有a所以我需要修改它。遗憾的是，var a = $('<div id="b" /><div id="a" />');不是解决方案

UPD 2 ：

上面的示例代码过于简单（与现实生活中的应用程序相比），因此在实际项目中，两个元素都可能没有id或者我可以排序的任何其他属性： - （

Answer 1

这是因为a只包含一个元素（a）。如果您想要预期的结果，请尝试使用

var a = $('<div id="a" />');
a.before($('<div id="b" />'));
console.log(a.add(a.prev()).toArray().reverse());

<强> Demo

Answer 2

var a = $('<div id="a" />');
var b = $('<div id="b" />');
a.before(b);
console.log(b.add(a));

Live example

Answer 3

要将元素添加到堆栈，请使用.add方法

a.add('<div id="b" />');

然而，现在他们已经失灵了。要解决此问题，您可以使用.sort（）方法。

a.sort(function(a,b){
  return a.id > b.id ? 1 : -1; // reverse 1 and -1 to reverse order
}

<击>

此外，由于您没有在dom中工作，因此在片段之前添加内容实际上不应该执行任何操作。

<击>

修改
以下是在ShankarSangoli的回答中使用toArray和.reverse的替代方法。

var a = $('<div id="a" />'); a.before($('<div id="b" />')); a = $(a[0].parentNode.childNodes);

感谢ShankarSangoli。

Answer 4

var a = $('<div id="b" /><div id="a" />');

这种语法会为你做吗？

以下是演示：http://jsfiddle.net/AfHWD/

<强>更新

如何将第一个元素包装在容器中，先于它，然后删除包装：

//we start with the initial element
var a = $('<div id="a" />'),

    //we then wrap it in a div, select that div, then prepend the new element, then we can select the children and remove the temporary wrapper
    b = a.wrap('<div />').parent().prepend('<div id="b" />').children().unwrap();

b现在包含以下内容：

<div id="b"></div><div id="a"></div>

以下是演示：http://jsfiddle.net/AfHWD/1/

没有DOM的.before（）行为

4 个答案: