Question

$(document).ready(function() {
          $('[class="any_character/s bgcolor-orange-10"').text(function(i, oldText) {
            return oldText === 'OK' ? 'Warning' : oldText;
          });
        });

我很难理解如何在JavaScript中处理类似REGEX的功能。我们如何用多个字符替换“any_character / s”或者实际上不存在可能存在的字符？

在我的特定示例中，类可以是：

1）class="bgcolor-green-10 bgcolor-blue-10 bgcolor-orange-10"

2）class="bgcolor-green-10 bgcolor-orange-10"

3）class="bgcolor-orange-10"

在每种情况下，它们之间的共同点是它们以：

结尾

bgcolor-orange-10

Answer 1

class属性不应被视为您使用属性选择器构建或修改或搜索的字符串（您知道，看起来像[class="something"]）。它只是元素上类的空格分隔连接表示。其中的类名顺序并不重要，不应该依赖它。

如果要选择具有特定类的元素，请使用标准.class-name表示法，如

$('.bgcolor-orange-10')

或直接使用DOM API

document.getElementsByClassName('bgcolor-orange-10')

或

document.querySelectorAll('.bgcolor-orange-10')

但是，我很困惑，为什么你的元素上有多个bgcolor-COLOR-10形式的类，它们的名称似乎做同样的事情和/或彼此冲突。您可能希望退后一步，检查您的逻辑，以了解发生这种情况的原因。

此问题与regexp无关。属性选择器中value的语法不是正则表达式模式，并且regexp不用于匹配这些值。即使你确实获得了class属性的值，也不应该使用regexp来检测是否存在特定的类 - DOM API和所有库都有用于此目的的接口，例如{{1}或者，在jQuery中，elt.classList.contains。如果您发现自己需要使用regexp，因为您构建的类名包含需要提取的魔法信息，例如.hasClass，并且您想查看data-bob-class是否存在，那么您应该重新审视你对类名的处理方法，因为类并不是真正用于以这种方式编码信息。

Answer 2

@David Thomas - 我已经习惯了你的建议。

这就是现在的工作方式：

$(document).ready(function() {
          $('[class$=bgcolor-orange-10]').text(function(i, oldText) {
            return oldText === 'OK' ? 'Warning' : oldText;
          });
        });

@torazaburo：我使用了几个类，因为这是我正在尝试开发的IBM InfoSphere DataStage监视的一部分，并且每个序列都有很多依赖项。因为我的内部监控DB没有主序列的“警告”条目，因为当他们的某些依赖项中止时它们实际上并没有中止（不要问我为什么 - 我不开发它们） - 我已经上来了仅在JS方面提供解决方案 - 如果依赖关系中止 - 它标记为“红色”，所有带有中止dep的主要seq标记为“橙色” - 文档加载后 - 使用解决方案我将状态更改为“确定” '到'警告'。

谢谢你们，大家好！我非常感谢你的好评 - 我知道我是一个真正的JavaScript初学者 - 我的主要经验是Python，它是......不同的。

你的所有答案都帮助我理解了我的JS知识是多么微薄 - 我还深入研究了一些关于JS的文章。

在特定结尾之前匹配类中的任何字符

2 个答案: