Как найти имя класса под конкретным родителем в jquery - PullRequest
Новая
       9

Как найти имя класса под конкретным родителем в jquery

0 голосов
/ 15 ноября 2018

У меня проблема здесь.Пожалуйста, обратитесь к HTML-коду ниже: 

<div class="main">
    <div class="second1">
        <div class="third1">
            <p></p>
        </div>
    </div>
    <div class="second2">
        <div class="third1">
            <h1></h1>
        </div>      
    </div>
</div>

Я хочу знать, какой из классов между second1 и second2 имеет тег h1.Потому что я хочу предупредить «h1 здесь», если он найден в second2, иначе «h1 не здесь»

Ответы [ 2 ]

0 голосов
/ 15 ноября 2018 
let secondClass = $('.main').find('h1').parent().parent().attr('class');
console.log("h1 tag is on" + secondClass);

if(secondClass === "second1"){
    //...
    alert("h1 is in second1");
}else{
    //...
    alert("h1 is in second2");
}
0 голосов
/ 15 ноября 2018

Просто нацельтесь на $('h1'), затем вы можете использовать .parent(), чтобы получить родительский элемент, и .attr('class'), чтобы получить имя (имена) класса.

Это можно увидеть в следующем: 

console.log($('h1').parent().attr('class'));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="main">
  <div class="second1">
    <div class="third1">
      <p></p>
    </div>
  </div>
  <div class="second2">
    <div class="third1">
      <h1></h1>
    </div>
  </div>
</div>

или , если вы хотите захватить тег <h1> в поле .second2, вы можете использовать .find() как $('.second2').find('h1').

Это можно увидеть в следующем (слегка измененном) коде: 

console.log($('.second2').find('h1').parent().attr('class'));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="main">
  <div class="second1">
    <div class="third1-in-second1">
      <h1></h1>
    </div>
  </div>
  <div class="second2">
    <div class="third1-in-second2">
      <h1></h1>
    </div>
  </div>
</div>

Вы можете проверить наличие класса с помощью .hasClass(), и вы захотите проверить, что дед (*)1039 *) имеет класс second2.

Это можно увидеть в следующем: 

if ($('h1').parent().parent().hasClass('second2')) {
  alert('h1 is here');
}
else {
  alert('h1 is NOT here');
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="main">
  <div class="second1">
    <div class="third1">
      <p></p>
    </div>
  </div>
  <div class="second2">
    <div class="third1">
      <h1></h1>
    </div>
  </div>
</div>
...