Изменить порядок DIV с помощью jquery

Question

Я работаю над клиентским сайтом на основе HTML, и мне нужно случайным образом заказать набор Div при обновлении страницы. Я бы обычно обрабатывал это через PHP и вызов базы данных, но это статический сайт.

Итак, мне интересно, знает ли кто-нибудь, как случайным образом отобразить набор div с использованием jquery?

Вот пример:

<div class="myItems">
     <div class="item">1</div>
     <div class="item">2</div>
     <div class="item">3</div>
</div>

и при обновлении может измениться на:

<div class="myItems">
     <div class="item">2</div>
     <div class="item">3</div>
     <div class="item">1</div>
</div>

Кто-нибудь знает, как это сделать?

Answer 1

Это сделает

 function reorder() {
           var grp = $(".myItems").children();
           var cnt = grp.length;

           var temp,x;
           for (var i = 0; i < cnt; i++) {
               temp = grp[i];
             x = Math.floor(Math.random() * cnt);
             grp[i] = grp[x];
             grp[x] = temp;
         }
         $(grp).remove();
         $(".myItems").append($(grp));
       }

Answer 2

На самом деле все довольно просто:

$(".myItems").html($(".myItems .item").sort(function(){
    return Math.random()-0.5;
}));

Вот и все! Наслаждайтесь.

Answer 3

Другим простым способом является ... 1. создать массив 2. сгенерировать случайное число и проверить, является ли оно нечетным или четным 3. Если нечетное, добавьте свой div в начало (метод shift).Если даже, добавьте ваш div внизу (метод push).4. Таким образом, ваши дивы будут расположены случайным образом в массиве.5. Теперь просто присоедините массив и добавьте его на свою страницу.

var divArray = [];

for(var i=0; i<divs.length; i++){
  //generate random number
  if(rand_num == odd)
     divArray.push( div[i] );
  else
     divArray.shift( div[i] );
}

$(myElem).html( divArray.join("") );