programing

jQuery를 사용하는 클래스와 가장 가까운 이전 형제를 어떻게 찾을 수 있습니까?

anycallme 2023. 10. 28. 08:11

jQuery를 사용하는 클래스와 가장 가까운 이전 형제를 어떻게 찾을 수 있습니까?

제가 작업할 수 있는 대략적인 HTML은 다음과 같습니다.

<li class="par_cat"></li>
<li class="sub_cat"></li>
<li class="sub_cat"></li>
<li class="par_cat"></li> // this is the single element I need to select
<li class="sub_cat"></li>
<li class="sub_cat"></li>
<li class="sub_cat current_sub"></li> // this is where I need to start searching
<li class="par_cat"></li>
<li class="sub_cat"></li>
<li class="par_cat"></li>

저는 그 곳에서 횡단해야 합니다..current_sub, 가장 가까운 이전의 것을 찾다.par_cat그리고 그것에 대해 무언가를 합니다

.find("li.par_cat")의 전체 로드를 반환합니다..par_cat(페이지에 30장 정도 있습니다.)단 한 명을 목표로 삼아야 합니다.

시도:

$('li.current_sub').prevAll("li.par_cat:first");

마크업을 통해 테스트:

$('li.current_sub').prevAll("li.par_cat:first").text("woohoo");
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul>
  <li class="par_cat"></li>
  <li class="sub_cat"></li>
  <li class="sub_cat"></li>
  <li class="par_cat">// this is the single element I need to select</li>
  <li class="sub_cat"></li>
  <li class="sub_cat"></li>
  <li class="sub_cat current_sub">// this is where I need to start searching</li>
  <li class="par_cat"></li>
  <li class="sub_cat"></li>
  <li class="par_cat"></li>
</ul>

가장 가까운 이전을 채울 것입니다.li.par_cat'우후'로.

prevTill()을 사용하면 모든 것을 얻을 필요 없이 먼 형제를 얻을 수 있습니다.prevAll()을 사용하여 CPU 집약도가 너무 높은 특히 긴 세트를 사용했습니다.

var category = $('li.current_sub').prev('li.par_cat');
if (category.length == 0){
  category = $('li.current_sub').prevUntil('li.par_cat').last().prev();
}
category.show();

일치하는 경우 첫 번째 선행 형제를 얻으며, 그렇지 않으면 일치하는 형제를 얻게 되므로 원하는 요소를 얻기 위해 prev()와 함께 한 개만 더 백업합니다.

해라

$('li.current_sub').prev('.par_cat').[do stuff];

저는 모든 답이 부족하다고 생각합니다.저는 이런 걸 쓰는 게 더 좋아요.

$('li.current_sub').prevUntil("li.par_cat").prev();

:first를 셀렉터 내부에 추가하지 않고 저장하며 읽기 쉽고 이해하기 쉽습니다.prevAll()을 사용하는 것보다 prevUntil() 메서드의 성능이 더 좋습니다.

다음 코드를 따를 수 있습니다.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
    $(document).ready(function () {
        $(".add").on("click", function () {
            var v = $(this).closest(".division").find("input[name='roll']").val();
            alert(v);
        });
    });
</script>
<?php

for ($i = 1; $i <= 5; $i++) {
    echo'<div class = "division">'
        . '<form method="POST" action="">'
        . '<p><input type="number" name="roll" placeholder="Enter Roll"></p>'
        . '<p><input type="button" class="add" name = "submit" value = "Click"></p>'
        . '</form></div>';
}
?>

여기서 아이디어를 얻을 수 있습니다.

언급URL : https://stackoverflow.com/questions/2310270/how-can-i-find-the-closest-previous-sibling-with-class-using-jquery