如何设计一个油猴脚本，实现以下功能：在网页中创建一个左浮动的按钮，该按钮的功能是遍历表格内容（假设是HTML表格），对于每一列的数据，检查其是否落在预设的范围内，如果数据超出范围，则应用红色样式显示，该按钮可以改变颜色

设计一个油猴脚本以实现这样的功能，首先你需要了解如何使用Chrome的API来修改页面元素和监听事件。下面是一个基本的步骤说明：

1. **添加CSS样式**：
在外部CSS文件或脚本内部，编写一个表示按钮和标记样式的类，比如：

   .my-button {
     float: left;
     background-color: #ccc;
   }

   .out-of-range {
     color: red;
   }

2. **创建HTML元素**：
使用JavaScript创建一个按钮元素，插入到目标位置，例如：

   var buttonHtml = `<button id="myButton" class="my-button">遍历表格</button>`;
   var buttonNode = document.createElement('div');
   buttonNode.innerHTML = buttonHtml;
   document.body.appendChild(buttonNode);

3. **按钮点击事件**：
为按钮添加点击事件处理器，当点击时触发遍历表格的操作：

   var button = document.getElementById('myButton');
   button.addEventListener('click', function() {
     // 接下来的代码将遍历表格并处理数据
   });

4. **遍历表格**：
使用`querySelectorAll`获取表格元素，然后遍历每列数据：

   var table = document.querySelector('table');
   var rows = table.rows;
   var columns = Array.from({ length: rows[0].cells.length }, (_, colIndex) => rows.map(row => row.cells[colIndex]));

   // 对于每一列...
   for (let column of columns) {
     for (let cell of column) {
       const value = cell.textContent.trim();
       let isInRange = validateRange(value, yourMin, yourMax); // 假设yourMin和yourMax是你设定的范围

       if (!isInRange) {
         cell.classList.add('out-of-range'); // 样式化超出范围的数据
       } else {
         cell.classList.remove('out-of-range');
       }
     }
   }
   
   // 公共函数，检查值是否在给定范围内：
   function validateRange(value, min, max) {
     return Number.isNaN(value) ? false : value >= min && value <= max;
   }

5. **按钮颜色变化**：
可以根据遍历结果更改按钮的颜色，例如在处理完所有单元格后：

   function updateButtonColor() {
     if (areAnyOutliers()) { // 假设areAnyOutliers()返回是否有超出范围的数据
       button.style.backgroundColor = 'red';
     } else {
       button.style.backgroundColor = '#ccc'; // 或者你想设置的其他颜色
     }
   }

   // ...在循环结束后调用updateButtonColor()

6. **清理工作**：
为了保持页面整洁，记得在完成任务后移除添加的CSS类：

   function cleanUp() {
     Array.from(document.querySelectorAll('.out-of-range')).forEach(cell => cell.classList.remove('out-of-range'));
     button.removeEventListener('click', arguments.callee); // 移除点击事件防止无限递归
   }

   button.addEventListener('click', updateButtonColor);
   button.addEventListener('mouseout', cleanUp);