jQuery에서 두 태그 사이의 모든 콘텐츠를 선택하는 방법

jQuery에서 두 태그 사이의 모든 콘텐츠를 선택하는 방법

---

제목과 순서가없는 목록이있는 문서가 있습니다.

JQuery를 사용하여 (고유 한 클래스 이름으로) 주어진 제목과 해당 제목과 다음 제목 사이의 모든 콘텐츠를 선택하려면 어떻게해야합니까?

최신 정보:

귀하의 제안은 훌륭하지만 내가 찾고있는 것이 아닙니다. 예를 들어 아래 코드에서 ID가 "heading2"인 "h1"에만 액세스하고 "heading3"ID를 가진 "h1"은 포함하지 않고 모든 항목에 액세스하고 싶습니다.

위에 제공된 jQuery 예제는 "h"태그가 아닌 첫 번째 "h"태그 뒤의 모든 항목에 액세스합니다.

... 또는 내가 틀렸다면 정정하십시오 :)

    <h1 id="heading1">...</h1>
        <ul>...</ul>
        <p>...</p>
        <ul>...</ul>
        <p>...</p>
    <h1 id="heading2" >...</h1>
        <ul>...</ul>
        <p>...</p>
        <ul>...</ul>
        <p>...</p>
    <h1 id="heading3" >...</h1>
        <ul>...</ul>
        <p>...</p>
        <ul>...</ul>
        <p>...</p>

---

특히 두 가지 방법이 문제를 해결 매우 유용 할 것입니다 : .nextUntil와 .andSelf. 첫 번째는 선택기를 따르는 모든 형제를 잡고 후자는 선택기와 일치하는 모든 항목에 일괄 처리하여 모두를 포함하는 하나의 jQuery 객체를 제공합니다.

$("#heading2")
    .nextUntil("#heading3").andSelf()
        .css("background", "red");

결과는 다음과 같습니다.

---

내 프로젝트에 사용하는 솔루션은 다음과 같습니다.

jQuery 선택기

(function ($) {
    $.fn.between = function (elm0, elm1) {
        var index0 = $(this).index(elm0);
        var index1 = $(this).index(elm1);

        if (index0 <= index1)
            return this.slice(index0, index1 + 1);
        else
            return this.slice(index1, index0 + 1);
    }
})(jQuery);

용법

$('body').between($('#someid'), $('#someid2')).each(function () {
    // Do what you want.
});

---

$('#secondSelector').prevAll('#firstSelector ~ *')

---

그래, 당신 말이 맞아. 이것은 원하는 선택자를 피할뿐입니다. 더 자세히 설명해야 할 수도 있습니다.

$(firstSelector).nextAll().not(secondSelector).not($(secondSelector).nextAll()).text()

---

아마도

$(selectorForFirstHeading).nextAll().not(selectorForLastHeading).text()

왜 사용 text()합니까? 첫 번째 결과 요소 html()의 내부 HTML 만 반환 하기 때문 입니다 .

---

jQuery 1.8 이상이 출시 된 이후로 받아 들여지는 답변에 약간의 업데이트가 필요한 것 같습니다. .andSelf()더 이상 사용되지 않습니다. 그 자리에 .addBack(). 문서는 당신이 알아야 할 모든 것을 설명합니다.

---

요소가 같은 수준에 있으면 다음과 같이됩니다.

<h1 id="heading1">...</h1>
<ul>...</ul>
<p>...</p>
<ul>...</ul>
<p>...</p>
<h1 id="heading2" >...</h1>

즉, 다음 표제 요소는 첫 번째 표제 요소와 동일한 수준에있는 요소의 하위 요소가 아닙니다. 이 코드를 시도해 볼 수 있습니다.

// This will get all the following siblings of <h1 id="heading1"> except those that are headings themselves
var elements = $('#heading1').nextAll().not("h1");

참조 URL : https://stackoverflow.com/questions/481076/how-to-select-all-content-between-two-tags-in-jquery