将项目从数组的前面添加到数组的结尾

Question

This seems very simple. Not quiet sure how I am making sure a mess of it.

I have an list. I want to take the first three items front the front and add them to the rear. I dont want to remove the items from the front. I want them to be on the front and on the rear.

So my list starts like this

[1,2,3,4,5,6,7,8,9,10]

and after I am done with it will look like this

[1,2,3,4,5,6,7,8,9,10,1,2,3]

This list is stored in a <ul>

Here is my code

_options.slides = $.makeArray($('.slide'));
var el = [];
$.each(_options.slides.splice(0, 3), function (x, item) {
     el.push(item);
});
$('#video-triggers').clone().append(el);  //break point here

Someone of the code is probably unnecessary as I have been playing around for this for too long. If I put a break point on the clone append line and execute the code in the console (development tools) here are the results

EDIT

The clone and append line has my results, but the container doesnt have those results?

Here are the results without the clone

EDIT 2

I also tried this

$('#video-triggers').append(_options.slides.concat(el))

Answer 1

You have your order of operations and variables mixed up . . . you are cloning your target <ul> , instead of the <li> 's that you want to copy. Try this . . .

Change this:

$('#video-triggers').clone().append(el);

. . . to this:

el.clone().appendTo($('#video-triggers'));

Answer 2

那是因为您克隆了它，然后将新元素添加到了克隆中（并且该克隆在您的页面上不存在）。

Answer 3

Use unshift(); to push items to front of array.

$.each(_options.slides.splice(0, 3), function (x, item) {
     el.push(item);
     el.unshift(item);
});

Answer 4

a = [1,2,3,4,5,6,7,8,9,10];
b = a.concat(a.slice(0,3));
console.log(b);
// [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 1, 2, 3]