题解 | #双色球机选一注#

反正本地是能正常使用的，当时做的时候第一个测试案例用了1w次方法，发现自己高亮的class类一直没去掉，现在去掉了,每次跑起来会有点卡，应该是循环用太多了，大家可以借鉴一下，拉到本地去改，本人JS萌新，写的代码比较基础，有大神的话可以帮忙改改，改完通过了私聊我一下，让我也学习学习

function randomFn() {

    // 创建一个随机生成数字的函数，并且指定长度,且可以指定边界范围
    function generate(end, length) {
      // 以下代码将随机生成一个1-end的整数变量
      var num = Math.floor(Math.random() * end + 1);
      var newArr = [num];
      // 利用newArr的遍历和IndexOf === -1，往数组里添加一个不重复的数
      while (newArr.length < length) {
        // 每次循环前先刷一次数据
        num = Math.floor(Math.random() * end + 1);
        newArr.forEach((item) => {
          if (newArr.indexOf(num) === -1) {
            newArr.push(num);
          }
        });
      }
      return newArr;
    }
    // 检测随机生成不重复的长度为length，范围为[1-end]的整数数组
    // console.log(generate(33,6))
    // 生成红球,并排序
    var redArr = generate(33, 6).sort((a, b) => {
      return a - b;
    });
    // console.log(redArr)
    // 生成蓝球
    var blueArr = generate(16, 1);
    // console.log(blueArr)
    // 遍历两个数组，实现输出的字符串格式 "06,10,13,18,23,27|05"
    var strResult = "";
    redArr.forEach((item, index) => {
      if (redArr[index] < 10) {
        redArr[index] = "0" + redArr[index];
        strResult += redArr[index] + ",";
      } else {
        redArr[index] = "" + redArr[index];
        strResult += redArr[index] + ",";
      }
    });
    // 去除最后一个 ‘，’，然后加入'|'和最后一个数字
    strResult = strResult.substring(0, strResult.length - 1);
    blueArr[0] = blueArr[0] < 10 ? "0" + blueArr[0] : "" + blueArr[0];
    strResult += "|" + blueArr[0];
    // console.log(redArr)
    // console.log(blueArr)
    // console.log(strResult)
    // 移动对应的dom节点至div的首位
    var div = document.getElementsByClassName("balls-wp");
    // 获取红球和蓝球的所以b标签
    var red = div[0].children,
      blue = div[1].children;
    //   先清空所有有类名为active的节点中的类
    Array.from(red).forEach((item) => {
      if (item.classList.contains("active")) {
        item.classList.remove("active");
      }
    });
    Array.from(blue).forEach((item) => {
      if (item.classList.contains("active")) {
        item.classList.remove("active");
      }
    });
    // console.log(red,blue)
    // 蓝球先开始
    // 这里blue是伪数组，所有要用Array.from浅拷贝成数组，这样才能有forEach方法
    // 这里复用，也可以考虑写个函数封装一下，完成案例就封装了
    Array.from(blue).forEach((item) => {
      if (item.innerText === blueArr[0]) {
        // 获取到了对应的子节点
        let dom = item;
        // 插入到父节点的第一个
        div[1].insertBefore(dom, div[1].childNodes[0]);
        // 添加属性
        dom.setAttribute("class", "active");
        return;
      }
    });
    for (let i = redArr.length - 1; i >= 0; i--) {
      Array.from(red).forEach((item) => {
        if (item.innerText === redArr[i]) {
          // 获取到了对应的子节点
          let dom = item;
          // 插入到父节点的第一个
          div[0].insertBefore(dom, div[0].childNodes[0]);
          // 添加属性
          dom.setAttribute("class", "active");
        }
      });
    }
    return strResult;
  }