jquery如何选择所有以“text-”开头的类元素？

Question

我有一些课程

.text-1
.text-2
.text-3

我想全选，怎么做？ 感谢您的帮助

Answer 1

试试这个。更多详情请参考jquery selectors

$('*[class^="text"]')

Answer 2

这是一个既准确又不太慢的解决方案的尝试：

var elts = $('*[class*="text-"]')
  .filter(function () {
    return this.className.match(/(?:^|\s)text-/);
  });

通过使用（希望）快速的 Sizzle 代码来查找在其 class 属性中的任何位置具有“text-”的元素，然后在每个元素上调用一个函数以将它们过滤到实际具有的元素"text-" 在类名的开头。

Answer 3

您不一定需要指定星号*，您也可以这样做：

$('[class^="text-"]')

注意- 在text 之后添加了您要查找的内容。

查看jQuery starts with selector 了解更多信息。

Answer 4

你可以在一个函数调用中只使用两个选择器来做到这一点：

$('[class^="text-"], [class*=" text-"]')

这将检查类属性是否以text- 开头，或者类字符串的任何部分是否有空格后跟text-。这解决了您在使用

时可能遇到的任何问题

$('[class^="text-"], [class*=" text-"]')
    .css('background-color', '#00FF00'); // add background color for demo

/* just for demo */
div:after {
  content: "class: " attr(class);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="text-1 test"></div>
<div class="text some-text-1"></div>
<div class="nope text-long-class-name"></div>
<div class="some-text-1"></div>
<div class="even get text-n-here"></div>

您可以将其拉出到一个函数中，该函数选择所有具有与给定前缀匹配的类的元素：

function selectElementsWithClassPrefix(prefix) {
    return $('[class^="' + prefix + '"], [class*=" ' + prefix + '"]');
}

Answer 5

这是一个处理多个类问题的函数，例如<div class="foo bar barfood">：

function classStartsWith(str) {
  return $('div').map( function(i,e) {
    var classes = e.className.split(' ');
    for (var i=0, j=classes.length; i < j; i++) {
      if (classes[i].substr(0, str.length) == str) return e;
    }
  }).get();
}

该函数返回一个匹配的 DOM 元素数组。你可以这样使用它：

$( classStartsWith('text-') ).doSomething();

这是一个例子：http://www.jsfiddle.net/Ms6ey/3/

当然这是假设选择器'div'。这个问题似乎是在询问任何元素。很容易让函数将选择器作为另一个参数，并使用它来代替示例中的硬编码。

Answer 6

$('#qvDetails,#qvAdd,.qvFramedActive,#qvMoreSizes').live('mouseover',function(){

        $(this).addClass('qvHover');                                                                            

    });

我的一个项目中的示例。您可以像上面一样同时提及 div 和类

您可以在同一个中提供逗号分隔的类或 div...