Выберите класс в теге i, который находится внутри тега ap, и добавьте класс в тег привязки в - PullRequest
Новая
       6

Выберите класс в теге i, который находится внутри тега ap, и добавьте класс в тег привязки в

0 голосов
/ 05 марта 2020

Я должен выбрать все теги привязки на странице, перед которыми стоит тег i, который имеет класс pdf. Тег i и якорь находятся внутри тега ap. А затем добавьте класс pdf к тегу привязки.

Я написал это, и он добавляет класс к тегу p. Мне просто нужно получить его, чтобы добавить его в тег привязки: 

$("p>i").each(function() {
  if ($(this).hasClass("pdf")) {
    $(this).parent().addClass('pdf');
  }
});
.pdf {
  color: red
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p><i class="pdf">&nbsp; nn</i> <a href="www.somesite.com">link</a></p>

Ответы [ 3 ]

2 голосов
/ 05 марта 2020

Если я правильно вас понимаю, все, что вам нужно, это $("p i.pdf + a").addClass('pdf'): 

$("p i.pdf + a").addClass('pdf')
.pdf {
  color: red
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p><i class="pdf">&nbsp; nn</i> <a href="www.somesite.com">link</a></p>
<p><i class="pdf">&nbsp; nn</i> <a href="www.somesite.com">link</a></p>
<p><i class="pdf">&nbsp; nn</i> <a href="www.somesite.com">link</a></p>

Селектор $("p i.pdf + a") выбирает все якоря, являющиеся родственными элементами элемента i, с классом pdf, который является потомком абзаца, и добавляет к ним класс pdf.

1 голос
/ 05 марта 2020

Использовать CSS селектор p>.pdf+a: 

$('p>.pdf+a').addClass('testClass');
.testClass {
  color: #f00;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p><i class="pdf">&nbsp; nn</i> <a href="www.somesite.com">link</a></p>
<p><i class="pdf">&nbsp; nn</i> <a href="www.somesite.com">link</a></p>
<p><i class="pdf">&nbsp; nn</i> <a href="www.somesite.com">link</a></p>
<p><i class="pdf">&nbsp; nn</i> <a href="www.somesite.com">link</a></p>
<p><i class="pdf">&nbsp; nn</i> <a href="www.somesite.com">link</a></p>
0 голосов
/ 05 марта 2020

Не сильно меняя код, используйте next(): 

$("p>i").each(function() {
  if ($(this).hasClass("pdf")) {
    $(this).next().addClass('pdf');
  }
});
.pdf {
  color: red;
  text-decoration: none;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<p><i class="pdf">&nbsp; nn</i> <a href="www.somesite.com">link</a></p>

<p><i>&nbsp; nn</i> <a href="www.somesite.com">link</a></p>

<p><i class="pdf">&nbsp; nn</i> <a href="www.somesite.com">link</a></p>

Лучше 

$("p>i.pdf").each(function() {
    $(this).next().addClass('pdf');
});
.pdf {
  color: red;
  text-decoration: none;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<p><i class="pdf">&nbsp; nn</i> <a href="www.somesite.com">link</a></p>

<p><i>&nbsp; nn</i> <a href="www.somesite.com">link</a></p>

<p><i class="pdf">&nbsp; nn</i> <a href="www.somesite.com">link</a></p>
...