Как нацелиться на первый тег Paragraph в теле с помощью jQuery - PullRequest
Новая
       24

Как нацелиться на первый тег Paragraph в теле с помощью jQuery

0 голосов
/ 25 октября 2019

Я хочу добавить класс «лидерство» к тегу первого абзаца на каждой странице моего сайта. Только первый экземпляр должен быть нацелен. Структура каждой страницы различна. Вот как я хочу, чтобы код функционировал. 

<body>
<div><div><p class="lead"></p></div></div>
<div><div><div><div><p></p></div></div></div></div>
<div><div><p></p><p></p></div></div>
<p></p>
<div><p></p></div>
</body>

Я пробовал несколько вариантов приведенного ниже кода и не могу заставить его работать.

Этот код предназначен дляпервый абзац и другие случайные абзацы. 

    jQuery(document).ready(function($) {
        $(document).ready(function() {
            $('body p:first-child').addClass('lead');
        });
    });

этот код ничего не делает 

    jQuery(document).ready(function($) {
        $(document).ready(function() {
            $('body p:first').addClass('lead');
        });
    });

1 Ответ

0 голосов
/ 25 октября 2019 

$(document).ready(function() {
  var lastTagIndex = $('body').find('p').length - 1
  $('body').find('p').eq(0).addClass('lead');
  $('body').find('p').eq(lastTagIndex).addClass('last');
});
.lead {
  color: red;
}

.last {
  color: blue;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<body>
  <div>
    <div>
      <p>1</p>
    </div>
  </div>
  <div>
    <div>
      <div>
        <div>
          <p>2</p>
        </div>
      </div>
    </div>
  </div>
  <div>
    <div>
      <p>3</p>
      <p>4</p>
    </div>
  </div>
  <p>5</p>
  <div>
    <p>6</p>
  </div>
</body>

Вы можете использовать find и eq для реализации.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...