大佬教程收集整理的这篇文章主要介绍了使用jQuery将div元素序列随机化，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
$(‘div.band div.member’);
将为您提供一个jquery对象，其中包含<div>与选择器匹配的jquery对象，即与classmember相同的div是与class的div的后代band。
jquery对象是一个类似于数组的对象，其中为每个匹配的元素分配了该对象的数值属性（如索引），并且length还定义了一个属性。得到一个元素是
// first element
$('div.band div.member')[0];
要么
// first element
$('div.band div.member').get(0);
除了选择所有元素，您还可以指定根据DOM中的位置选择特定元素。例如
// get the first div with class member element
$("div.band div.member:eq(0)")
要么
// get the first div with class member element
$("div.band div.member:nth-child(1)")
这是我刚刚淘汰的插件
(function($) {
$.fn.randomize = function(childElem) {
return this.each(function() {
var $this = $(this);
var elems = $this.children(childElem);
elems.sort(function() { return (Math.round(Math.random())-0.5); });
$this.detach(childElem);
for(var i=0; i < elems.length; i++)
$this.append(elems[i]);
});
}
})(jquery);
这是一个 。将 添加到URL以查看代码。如果您需要有关其工作原理的任何详细信息，请发表评论。它可能可以使它在处理某些情况时更加健壮（例如，如果该插件希望连接到jquery对象的其他子元素），但它会满足您的需求。
演示中的代码
$(function() {
$('button').click(function() {
$("div.band").randomize("div.member");
});
});
(function($) {
$.fn.randomize = function(childElem) {
return this.each(function() {
var $this = $(this);
var elems = $this.children(childElem);
elems.sort(function() { return (Math.round(Math.random())-0.5); });
$this.remove(childElem);
for(var i=0; i < elems.length; i++)
$this.append(elems[i]);
});
}
})(jquery);
@R_419_6832@
<div class="band">
<div class="member">
<ul>
<li>John</li>
<li>Lennon</li>
</ul>
</div>
<div class="member">
<ul>
<li>Paul</li>
<li>McCartney</li>
</ul>
</div>
<div class="member">
<ul>
<li>George</li>
<li>Harrison</li>
</ul>
</div>
<div class="member">
<ul>
<li>Ringo</li>
<li>Starr</li>
</ul>
</div>
</div>
<button>Randomize</button>
我正在尝试使用jQuery进行第一步，但是我很难理解如何从div父元素中找到子元素列表。我曾经使用过ActionScript 2和ActionScript
3，所以我可能会误解一些概念，例如用jQuery将div元素序列随机化的更好方法是什么！
我有HTML代码的以下简单部分：
<div class="band">
<div class="member">
<ul>
<li>John</li>
<li>Lennon</li>
</ul>
</div>
<div class="member">
<ul>
<li>Paul</li>
<li>McCartney</li>
</ul>
</div>
<div class="member">
<ul>
<li>George</li>
<li>Harrison</li>
</ul>
</div>
<div class="member">
<ul>
<li>Ringo</li>
<li>Starr</li>
</ul>
</div>
</div>
我尝试了某种方法来执行此操作，例如将map .member divs放在一个数组中，然后更改排序顺序，但没有成功。
function setArrayElements (element_parent) {
var arr = [];
//alert (element_parent[0].innerHTML);
for (var i = 0; i < element_parent.children().length; i ++) {
arr.push (element_parent[i].innerHTML);
}
}
setArrayElements($(".band"));
当我尝试警告 element_parent [0]时， 我想获取div的 .member 列表的第一个孩子，但事实并非如此。
如果我使用 element_parent [0] .innerHTML 发出警报，我会看到：
<div class="member">
<ul>
<li>John</li>
<li>Lennon</li>
</ul>
</div>
<div class="member">
<ul>
<li>Paul</li>
<li>McCartney</li>
</ul>
</div>
<div class="member">
<ul>
<li>George</li>
<li>Harrison</li>
</ul>
</div>
<div class="member">
<ul>
<li>Ringo</li>
<li>Starr</li>
</ul>
</div>
为什么？我该怎么做才能让一个这样的会员呢？
<div class="member">
<ul>
<li>Paul</li>
<li>McCartney</li>
</ul>
</div>
我敢肯定这应该很容易，但是我不知道怎么做:(
编辑：
感谢您的牢度和以各种方式让被选中的孩子，我将在以后记下这些方式！我尝试了这种方法，但似乎无法获得整个div（请告诉我如果我弄错了什么，可能太多！）。
我应该得到这个内容：
<div class="member">
<ul>
<li>Ringo</li>
<li>Starr</li>
</ul>
</div>
但是使用诸如 $（“ div.band div.member：eq（2）”） 这样的方法之一或其他有用的方法，我得到了：
alert ($('div.band div.member')[0]);
/* result
<ul>
<li>Ringo</li>
<li>Starr</li>
</ul>
*/
所以有没有办法在我的节点中也获取 .member div容器？
以上是大佬教程为你收集整理的使用jQuery将div元素序列随机化全部内容，希望文章能够帮你解决使用jQuery将div元素序列随机化所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。