如何在jQuery的for循环中随机选中部分元素执行数值修改操作

要实现单次循环内选中指定数量的随机元素处理，核心是先生成不重复的随机索引集合，遍历元素时匹配索引执行自定义逻辑即可，两种常见场景的实现如下：

场景1：每次循环允许重复抽取元素 #

不需要保证多次循环抽到的元素不重复，仅需单次循环抽指定数量的随机元素：

// 生成指定数量的不重复随机索引
function getRandomIndexes(total, count) {
  const indexes = Array.from({length: total}, (_, i) => i);
  // Fisher-Yates 洗牌算法打乱数组，效率远高于随机生成后去重
  for (let i = indexes.length - 1; i > 0; i--) {
    const j = Math.floor(Math.random() * (i + 1));
    [indexes[i], indexes[j]] = [indexes[j], indexes[i]];
  }
  return indexes.slice(0, count);
}

// 业务逻辑代码
const $elements = $('.your-target-class'); // 替换为你要选中的元素选择器
const total = $elements.length;
const pickCount = 10; // 单次循环要选中的元素数量

function processRandomElements() {
  const targetIndexes = getRandomIndexes(total, pickCount);
  $elements.each(function(index) {
    if (targetIndexes.includes(index)) {
      // 此处替换为你的自定义逻辑，示例为元素文本数值加5
      const currentVal = parseInt($(this).text(), 10) || 0;
      $(this).text(currentVal + 5);
      // 如果要加随机数可以替换为：
      // const randomVal = Math.floor(Math.random() * 20) + 1; // 1-20的随机整数
      // $(this).text(currentVal + randomVal);
    }
  })
}

// 调用一次即执行一次随机选取处理
processRandomElements();

场景2：多次循环抽取不重复元素 #

需要保证每次抽到的都是之前未处理过的元素，直到所有元素都被处理过再重置抽取池：

const $elements = $('.your-target-class');
const total = $elements.length;
const pickCount = 10;
// 维护未处理的索引池
let remainingIndexes = Array.from({length: total}, (_, i) => i);

function processRandomElementsNoRepeat() {
  // 打乱剩余索引
  for (let i = remainingIndexes.length - 1; i > 0; i--) {
    const j = Math.floor(Math.random() * (i + 1));
    [remainingIndexes[i], remainingIndexes[j]] = [remainingIndexes[j], remainingIndexes[i]];
  }
  const currentPick = remainingIndexes.splice(0, pickCount);
  
  $elements.each(function(index) {
    if (currentPick.includes(index)) {
      const currentVal = parseInt($(this).text(), 10) || 0;
      $(this).text(currentVal + 5);
    }
  })
  
  // 所有元素处理完成后重置索引池，可重新开始抽取
  if (remainingIndexes.length === 0) {
    remainingIndexes = Array.from({length: total}, (_, i) => i);
  }
}

processRandomElementsNoRepeat();

简化实现（不限制单次抽取数量） #

如果不需要严格控制单次抽取的元素个数，仅需要每个元素有固定概率被选中，可以直接简化判断逻辑：

$('.your-target-class').each(function() {
  // 30%概率被选中，可自行调整概率值
  if (Math.random() < 0.3) {
    const currentVal = parseInt($(this).text(), 10) || 0;
    $(this).text(currentVal + 5);
  }
})

• 上述方案适配元素数量较多的场景，不会出现性能问题
• 自定义逻辑部分可自行修改，除修改数值外也支持添加样式、修改属性等操作
• 随机数范围可根据需求调整，比如生成10-30的随机整数可写为Math.floor(Math.random() * 21) + 10

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