Question

我正在尝试通过执行以下操作来检查<tr>元素是否具有以某个值开头的类名：

$('tr[class^="value"]')

但这似乎不起作用。我怎样才能做到这一点？

Answer 1

更新

$('tr').filter(function() {
    var classNames = this.className.split(/\s+/);
    for (var i=0; i < classNames.length; i++) {

        // check if the class starts with the value
        if (classNames[i].substr(0, 5) === "value") {
            return true;
        }

        // or you could use a regex
        if (/^value/.test(classNames[i])) {
            return true;
        }
    }
    return false;
}).each(...);

为什么不尝试使用the hasClass() method？

$('tr').hasClass('value');

Answer 2

你的问题似乎是你有tr元素，只想检查它是否有一个以某个值开头的类，所以：

var value = 'whatever';
var re = new RegExp('(^|\\s)' + value);
if (re.test(tr.className)) {
  // tr has a class name starting with value
}

或者您是否要选择所有具有以特定值开头的类的TR？如果你的TR只有一个类，你可以使用querySelectorAll：

var trs = document.querySelectorAll('tr[class^=' + value + ']');

或者在简单的javascript中：

var el, els = document.getElementsByTagName('tr');
var re = new RegExp('(^|\\s)' + value);
var result = [];

for (var i=0, iLen=els.length; i++) {
    el = els[i];

    if (re.test(el.className)) {
        result.push(el);
    }
}
// do something with result array

结果是按文档顺序匹配TR的数组。

Answer 3

你可以使用 Hristo 建议结合jQuery自定义表达式，如果你会大量使用它，但是因为我做了基准测试，它可以很容易地慢3-4倍。

示例：

$.expr[':'].classStarts = function(elem, index, match) {
    var classNames = elem.className.split(/\s+/);

    /* getting only the value passed inside the parentheses */
    var filter = match[0].match(/\(([^\(\)]+)\)/, '')[1];
    for (var i = -1, _len = classNames.length; ++i < _len; ) {

        if (classNames[i].substr(0, filter.length) === filter) {
            return true;
        }

    }
    return false;
};
// USING
$('div:classStarts(myClass)').css('color', 'red');

检查tr元素的类名是否以某个值开头

3 个答案:

更新