有没有重新排列div顺序的方法？更确切地说，我如何从
<div id="1"></div> <div id="2"></div> <div id="3"></div> <div id="4"></div>
这个
<div id="3"></div> <div id="1"></div> <div id="4"></div> <div id="2"></div>
或者在每次重新加载时的任何其它顺序。
kyvafyod1#
就这么简单
$("#parent").html($("#parent").children().sort(function() { return 0.5 - Math.random() }));
下面是工作示例http://jsfiddle.net/CPQXw/1/
ijxebb2r2#
请参见：http://jsfiddle.net/KfY4u/
$("div.container div").sort(function(){ return Math.random()*10 > 5 ? 1 : -1; }).each(function(){ var $t = $(this); $t.appendTo( $t.parent() ); });
这适用于任意数量的div标记
div
r7knjye23#
另一个片段：http://jsfiddle.net/t8gU7/
var $divs = $('#container div'); for(var j, x, i = $divs.length; i; j = parseInt(Math.random() * i), x = $divs[--i], $divs[i] = $divs[j], $divs[j] = x); $('body').append($divs);
1tuwyuhd4#
像这样？
var ids = [], max = 4, i = 0, rand = 0; while(i < max){ do{ rand = Math.floor(Math.random() * max); } while(ids.indexOf(rand) < 0) ids.push(rand); i++; }
ztyzrc3y5#
我假设你有一个数组，其顺序如下：变量顺序=[3，1，4，2];现在，我假设您有一个容器div用于div，如下所示：
<div id="container"> <div id="1"></div> <div id="2"></div> <div id="3"></div> <div id="4"></div> </div>
您应该如何继续：从末尾到开头遍历数组，并将带有相应id的每个div前置到"container" div：
$(document).ready(function() { var order = [3, 1, 4, 2]; for(var i=order.length-1; i>=0; i--) { $('#container').prepend($('#'+order[i])); } });
好好享受吧!编辑：我对这个问题的理解是如何重新排列div而不是如何生成一个新的随机顺序!抱歉，如果我错过了重点，但这正是你在问题中问的。
fkaflof66#
Vanilla Javascript ES6是完成此任务的最佳选择。实现基于提供的HTML结构。
let divs = document.querySelectorAll("div"); let randomDiv = Array.from(divs).sort(() => { return 0.5 - Math.random(); }); document.body.innerHTML = ""; randomDiv.map((x) => { document.body.innerHTML += `<div id=${x.id}>${x.textContent}</div>` });
<body> <div id="1">1</div> <div id="2">2</div> <div id="3">3</div> <div id="4">4</div> </body>
6条答案
按热度按时间kyvafyod1#
就这么简单
下面是工作示例http://jsfiddle.net/CPQXw/1/
ijxebb2r2#
请参见：http://jsfiddle.net/KfY4u/
这适用于任意数量的
div标记r7knjye23#
另一个片段：
http://jsfiddle.net/t8gU7/
1tuwyuhd4#
像这样？
ztyzrc3y5#
我假设你有一个数组，其顺序如下：变量顺序=[3，1，4，2];现在，我假设您有一个容器div用于div，如下所示：
您应该如何继续：从末尾到开头遍历数组，并将带有相应id的每个div前置到"container" div：
好好享受吧!
编辑：我对这个问题的理解是如何重新排列div而不是如何生成一个新的随机顺序!抱歉，如果我错过了重点，但这正是你在问题中问的。
fkaflof66#
Vanilla Javascript ES6是完成此任务的最佳选择。实现基于提供的HTML结构。