JavaScript 一次替换文本中的多个字符

Question

我有一个表，我试图根据表中的值着色。 因此，如果表中的值为 150%，则单元格将显示为红色。 如果表中的值为 50%，则该值将显示为绿色。 但是，由于某种原因，表格中的实际文本中包含大量空格以及 % 符号。 如何用空 ('') 替换任何空格和 '%' 字符？

这是我所拥有的不起作用的：

<script type="text/javascript">

        $(document).ready(function () {
            $('#myTable td.PercentMem').each(function () {
                if ($(this).text().replace(/\s/g, '').replace('%', '') >= '100') {
                    $(this).css('background-color', '#ff0000');
                }
                else {
                    $(this).css('background-color', '#33cc33');
                }
            });
        });

    </script>

谢谢！

编辑

我很笨。 我忘了包括这些百分比中有小数点的事实。 所以，我真正处理的是“50.89%”之类的东西，到目前为止提供的解决方案将其转换为“5089”。 我怎样才能保留小数点？

Answer 1

您需要去除所有非数字字符并将结果字符串转换为 int。 所以像这样： parseInt($(this).text().replace(/\D/g,'')) 。 此外，在您的帖子中，您正在与字符串'100'进行比较，这显然应该是一个数字。 尝试这个：

        $(document).ready(function () {
            $('#myTable td.PercentMem').each(function () {
                if (parseInt($(this).text().replace(/\D/g,'')) >= 100) {
                    $(this).css('background-color', '#ff0000');
                }
                else {
                    $(this).css('background-color', '#33cc33');
                }
            });
        });

免责声明：我还没有实际测试过，但这应该可以。

Answer 2

你可以用这个来实现，避免使用 jQuery 到 select 元素，使用纯 JavaScript：

const myCells = document.querySelectorAll('.PercentMem');

myCells.forEach(cell => {
  const cellValue = cell.textContent.replace(/\D+/g, '');
        
  cell.classList.toggle(parseInt(cellValue) >= 100 ? 'red' : 'green');
});

这是包含所有代码的完整提琴手。