Question

我有2个类，我想在页面的DOM中获取它们，以便将它们的内容文本与jQuery进行比较。我相信在JS中它是这样的：

function myFonction() {
  var item = document.getElementsByClassName("title")[0];
  if (item) {
    for (var i = 0; i < document.getElementsByClassName("title2").length; i++) {
      var content = document.getElementsByClassName("title2")[i].innerHTML.trim();
      if (content == item.innerHTML.trim()) {
        console.log("OK");
      }
    }
  }
}
myFonction();

Answer 1

由于您在答案中标记了jQuery，我将提供基于jQuery的解决方案。事情变得更加直截了当，因为你不需要为循环制造麻烦。

您想要做的是：

缓存/存储第一个.title元素的内部HTML
如果.title元素存在，则遍历所有.title2元素并将其内部HTML与第1点中的缓存元素进行比较

我在下面提供了一个概念验证示例。匹配元素以黄色突出显示，仅用于视觉指示。

$(function() {
  var compareTitle = function() {
    var $title = $('.title').first(),
        titleContent = $title.html().trim();
        
    if ($title.length) {
      $('.title2').each(function() {
        if ($(this).html().trim() === titleContent) {
          console.log('OK');
          $(this).css('background-color', 'yellow');
        }
      });
    }
  }
  compareTitle();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="title">This is a title.</div>
<div class="title2">This is not a title.</div>
<div class="title2">This is not a title.</div>
<div class="title2">This is not a title.</div>
<div class="title2">This is a title.</div>
<div class="title2">This is not a title.</div>
<div class="title2">This is not a title.</div>
<div class="title2">This is a title.</div>
<div class="title2">This is not a title.</div>
<div class="title2">This is not a title.</div>
<div class="title2">This is not a title.</div>
<div class="title2">This is not a title.</div>

如果你想在原生JS中使用它，那也不是问题。在执行for循环时，它有点毛茸茸;）另外，您始终可以利用document.querySelectorAll()。

var compareTitle = function() {
  var title = document.querySelectorAll('.title')[0],
      titleContent = title.innerHTML.trim();

  if (title) {
    var title2 = document.querySelectorAll('.title2');
    for (var i=0; i<title2.length; i++) {
      if (title2[i].innerHTML.trim() === titleContent) {
        console.log('OK');
        title2[i].style.backgroundColor = 'yellow';
      }
    }
  }
}
compareTitle();

<div class="title">This is a title.</div>
<div class="title2">This is not a title.</div>
<div class="title2">This is not a title.</div>
<div class="title2">This is not a title.</div>
<div class="title2">This is a title.</div>
<div class="title2">This is not a title.</div>
<div class="title2">This is not a title.</div>
<div class="title2">This is a title.</div>
<div class="title2">This is not a title.</div>
<div class="title2">This is not a title.</div>
<div class="title2">This is not a title.</div>
<div class="title2">This is not a title.</div>

Answer 2

为每个班级使用.getElementsByClassName。迭代.get结果，如果groupA [i] == groupB [i]则执行任何操作。如果你太懒，那就让我为你做一个＆＃34;点＆＃34;。洛尔

获取所有元素dom jquery

2 个答案: