如何仅打乱指定class的子元素顺序，保留其他子元素原有顺序？

可以通过分离目标元素与固定元素、单独打乱目标元素、再重构元素序列的方式实现，具体代码如下：

$(function () {
    // 父容器
    const parent = $(".slider-thumbs .swiper-wrapper");
    // 获取所有子元素的数组副本
    const allChildren = parent.children().toArray();
    // 筛选出需要打乱的特定class元素（替换成你实际的class名，比如.shuffle-me）
    const shuffleItems = allChildren.filter(child => $(child).hasClass('shuffle-me'));
    
    // Fisher-Yates 洗牌算法：公平打乱目标元素数组
    for (let i = shuffleItems.length - 1; i > 0; i--) {
        const randomIndex = Math.floor(Math.random() * (i + 1));
        [shuffleItems[i], shuffleItems[randomIndex]] = [shuffleItems[randomIndex], shuffleItems[i]];
    }
    
    // 重构子元素序列：固定元素保持原位置，目标元素替换为打乱后的
    const newChildList = allChildren.map(child => {
        return $(child).hasClass('shuffle-me') ? shuffleItems.shift() : child;
    });
    
    // 更新父容器内容
    parent.empty().append(newChildList);
});

关键逻辑说明： #

• 先把父容器的所有子元素转成数组，保留原始顺序记录
• 筛选出需要打乱的特定class元素，用Fisher-Yates算法单独打乱（比你原代码的splice方式更高效公平）
• 遍历原始元素数组，遇到非目标class的元素直接保留，遇到目标class的元素则从打乱后的数组中取第一个替换
• 最后清空父容器，把重构后的元素序列重新插入，确保非目标元素的位置和顺序完全不变

内容的提问来源于stack exchange，提问作者Anta