Javascript document.getElementsByClassName与类完全匹配

有两个类似的类-“项目”和“项目一”

当我使用

document.getElementsByClassName（'item'）

时，它返回与上面两个类匹配的所有元素

如何仅使用“item”类获取元素

document.querySelectorAll('.item:not(.one)');

（见附件）

另一种方法是在what

文档上循环。getElementsByCassName（'item'）

返回，并检查

一个类是否存在：

classname
item one
表示元素具有class
item
和class
one

因此，当您执行
document.getElementsByClassName（'item'）
时，它也会返回该元素

您应该执行类似的操作来选择只包含类
项的元素
：

e = document.getElementsByClassName('item');
for(var i = 0; i < e.length; i++) {
    // Only if there is only single class
    if(e[i].className == 'item') {
        // Do something with the element e[i]
        alert(e[i].className);
    }
}

e=document.getElementsByClassName（'item'）；
对于（变量i=0；i

这将检查元素是否只有class
项

您需要为精确匹配创建自己的函数，因为类中的空格意味着它有多个类。比如：

function GetElementsByExactClassName(someclass) {
  var i, length, elementlist, data = [];

  // Get the list from the browser
  elementlist = document.getElementsByClassName(someclass);
  if (!elementlist || !(length = elementlist.length))
    return [];

  // Limit by elements with that specific class name only
  for (i = 0; i < length; i++) {
    if (elementlist[i].className == someclass)
      data.push(elementlist[i]);
  }

  // Return the result
  return data;
} // GetElementsByExactClassName

函数GetElementsByExactClassName（someclass）{
变量i，长度，元素列表，数据=[]；
//从浏览器中获取列表
elementlist=document.getElementsByCassName（someclass）；
如果（！elementlist | |！（length=elementlist.length））
返回[]；
//仅限具有该特定类名的元素
对于（i=0；i
您可以使用来筛选匹配集，使其仅为具有类
测试的匹配集：

var elems = Array.filter( document.getElementsByClassName('test'), function(el){
    return !!el.className.match(/\s*test\s*/);
});

或者仅使用
测试
，但不使用
一个测试
：

var elems = Array.filter( document.getElementsByClassName('test'), function(el){
    return el.className.indexOf('one') < 0;
});

var elems=Array.filter（document.getElementsByClassName（'test'），函数（el）{
返回el.className.indexOf（'one'）<0；
});

（
Array.filter
的工作方式可能因浏览器而异，在较旧的浏览器中不可用。）为了获得最佳的浏览器兼容性，最好这样做：
$（'.test:not（.one））
如果您有jQuery，可以使用如下语法：
$（'[class=“item”]'）

如果您坚持使用
document.getElementsByClassName
，请参阅其他答案。
最后一个答案不是类似的类，它是完全相同的类，而类
one
，空格分隔意味着两个不同的类！OP.Right未指定jquery，但不建议使用。请参阅该答案，其中详细介绍了jQuery相对于使用
querySelectorAll
的优势。如果您开始谈论兼容性，那么您应该知道
getElementsByClassName
在不同浏览器之间也是不一致的。这取决于OP是否支持旧浏览器，如果他想做sook，我知道了。但是我如何才能得到属于类“item”而不是类“one”的元素呢？（e[I].className！=“item one”）是有效的，但不是您的条件。我想，因为在我的例子中，第一个类是'item'@Marat。你能分享你的HTML吗？如果类名被指定为
，这将不包括它，即使它只有一个类。不要让你的测试是严格的字符串相等。否则，好答案+1在这种情况下，它仍然是正确的，因为我假设他希望测试与类字段中的测试完全相同。他没有具体说明这是否是要求。但是，是的，我也可以看到…它确实与类完全匹配…空格在
类
属性中是不相关的。他没有说完全匹配class属性，因为这是毫无意义的
var elems = Array.filter( document.getElementsByClassName('test'), function(el){
    return el.className.indexOf('one') < 0;
});