javascript - 如何使用JavaScript交换屏幕上的元素

我有多个“li”元素:

$(".my_lis")

在页面上，我想用JavaScript(我正在使用JQuery)对其进行混洗。怎么做？

最佳答案

其实并不难。总体思路是:

抓取所有dom节点

随机播放

清空<ul>并插入经过改组的节点

-

var items = $('.my_list li').get();

//edit (per comments): avoid confusion
items = shuffle(items);

$('.my_list').empty().append(items);

在shuffle()可以是对数组进行混洗的任何地方的地方，我更喜欢underscore.js，但这是一种在数组上进行混洗的普通JavaScript方法:

只是改组ANY数组的示例

function shuffle(items) {

    for(var index = 0, ln = items.length; index < ln; index++) {
        var item = items[index],
            swapIndex = ~~(Math.random() * ln),
            swapItem = items[swapIndex];

        //Swap places
        items.splice(swapIndex, 1, item);
        items.splice(index, 1, swapItem);
    }

    return items;
}