Помогите поправить скрипт рандомного показа блоков

surjan

Постоялец
Заблокирован
Регистрация
29 Авг 2009
Сообщения
60
Реакции
10
  • Автор темы
  • Заблокирован
  • #1
Всем привет, нужна помощь.
Есть скрипт, который перемешивает блоки div:
Код:
<script>
       window.onload = function ()
{
  function mix(b) {
  for (var c = document.createElement("div"), d = 0; d < b.length; d++) {
         var a = Math.floor(Math.random() * b.length),
             e = b[d],
             f = e.parentNode,
             a = b[a],
             g = a.parentNode;
         f.insertBefore(c, e);
         g.insertBefore(e, a);
         f.insertBefore(a, c)
  }
  c.parentNode.removeChild(c)
};
  mix(document.getElementsByTagName("div"))
}
  </script>
Скрипт рандомно перемешивает конструкцию следующего вида:
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>

Проблема в том, что у меня вложенные дивы с некоторыми другими тегами, а этот скрипт перемешивает только те блоки div, в которых кроме текста больше ничего нет.

А нужно чтобы:
1) Перемешивались все div-ы со всем содержимым в них.
2) Или перемешивались все дивы имеющие некий класс, типа: (div class="random").
3) Либо же окружить все div-ы тегом <p> и все, что находится между тегом <p>, перемешать.
 
Последнее редактирование:
Можно и по классу. Заменить
HTML:
mix(document.getElementsByTagName("div"))
на
HTML:
mix(document.getElementsByClassName("random"))
и все дивы сделать <div class="random">
<-------------- добавлено через 40799 сек. -------------->
HTML:
<script src="https://code.jquery.com/jquery-1.9.1.js"></script>

<div class="my_random">
    <div>1<b>Бла-бла</b></div>
    <div>2</div>
    <div>3</div>
    <div>4<i>хрю-хрю</i></div>
    <div><div>5</div></div>
</div>

<script>
  var arr = $('.my_random > div').get().sort(function(){
     return 0.5 - Math.random();
  });
  $('.my_random').html(arr);
</script>
Что-то у меня не хочет этот код работать. Если уж юзать jquery, то можно так:

HTML:
<script  src="//code.jquery.com/jquery-3.2.1.min.js"></script>

<div class="my_random">
  <div>1<b>Бла-бла</b></div>
  <div>2</div>
  <div>3</div>
  <div>4<i>хрю-хрю</i></div>
  <div>
    <div>5</div>
  </div>
</div>

<script>
$('.my_random > div').sort(function() {
  return Math.random() * 10 > 5 ? 1 : -1;
}).each(function() {
  var $t = $(this);
  $t.appendTo($t.parent());
});
</script>

В работе: Для просмотра ссылки Войди или Зарегистрируйся
 
Проблема в том, что у меня вложенные дивы с некоторыми другими тегами, а этот скрипт перемешивает только те блоки div, в которых кроме текста больше ничего нет.
HTML:
<script src="https://code.jquery.com/jquery-1.9.1.js"></script>

<div class="my_random">
    <div>1<b>Бла-бла</b></div>
    <div>2</div>
    <div>3</div>
    <div>4<i>хрю-хрю</i></div>
    <div><div>5</div></div>
</div>

<script>
  var arr = $('.my_random > div').get().sort(function(){
     return 0.5 - Math.random();
  });
  $('.my_random').html(arr);
</script>
<-------------- добавлено через 11900 сек. -------------->
Что-то у меня не хочет этот код работать.
Нечему не работать
Для просмотра ссылки Войди или Зарегистрируйся
:glob:
 
  • Автор темы
  • Заблокирован
  • #4
Что-то у меня не хочет этот код работать
У меня сразу все заработало. Спасибо за помощь.

А перед моими скриптами стоит вот это:
Код:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
может поэтому все работает как нужно.
 
Назад
Сверху