Используйте jQuery, чтобы сравнить класс внутри идентификатора с другим классом внутри идентификатора.

Question

Последние 5 дней я кодировал ~ 60+ часов, поэтому я прошу прощения, если из-за выгорания этот вопрос слишком тривиален: -)

У меня есть HTML, как this:

<div id="blah1_1">
  <label for="blah1_1">
    <span class="inner">hi</span>
  </label>
</div>
<div id="blah1_2">
  <label for="blah1_2">
    <span class="inner">yes</span>
  </label>
</div>

<div id="blah2_1">
  <label for="blah2_1">
    <span class="inner">yes</span>
  </label>
</div>
<div id="blah2_2">
  <label for="blah2_2">
    <span class="inner">no</span>
  </label>
</div>

Все, что я хочу сделать, это использовать jQuery для:

1.) Получить CSS -эквивалентное значение "# blah1_1 .inner". Я попытался:

    alert ( $("#blah1_1 .inner").val() );

, но потерпел неудачу.

2.) Сравните значение #blah1_1.inner со значением #blah2_1.inner. Если равно, то выведите подтверждение.

3.) Удвойте l oop через blah1_* «Массив» и сравните его с «массивом» blah2_ *. Если blah1_[x] = blah2_[y], тогда подтвердите. Например, сравните все blah1_*' с blah2_1 ... затем сравните blah1_* с blah2_2 и т. Д. 1030 *.

Небольшая помощь поздней ночи / эффекта красных глаз , пожалуйста? (ТИА!)

Answer 1

ваш alert ( $("#blah1_1 .inner").val() ); должен alert ( $("#blah1_1 .inner").text() );

, затем вы можете использовать Селектор атрибутов , чтобы выбрать оба набора blah1_* и blah2_*

, затем использовать .each () jQuery метод для перебора меток:

затем для сравнения:

$(document).ready(function() {
  const elms1 = $('[id^="blah1"]');
  const elms2 = $('[id^="blah2"]');
  
  const labels1 = elms1.find('label');
  const labels2 = elms2.find('label');
  
  labels1.each(function(index1, el1){ 
    labels2.each(function(index2, el2){
      console.log($(el2).text() === $(el1).text())
    })
  })
})

<div id="blah1_1">
  <label for="blah1_1">
    <span class="inner">hi</span>
  </label>
</div>
<div id="blah1_2">
  <label for="blah1_2">
    <span class="inner">yes</span>
  </label>
</div>

<div id="blah2_1">
  <label for="blah2_1">
    <span class="inner">yes</span>
  </label>
</div>
<div id="blah2_2">
  <label for="blah2_2">
    <span class="inner">no</span>
  </label>
</div>
<script
  src="https://code.jquery.com/jquery-3.4.1.min.js"
  integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
  crossorigin="anonymous"></script>