JQuery, как пройти через более чем один элемент одного уровня - PullRequest
0 голосов
/ 29 октября 2018

У меня есть проект jQuery, где я должен пройтись по списку заголовков h2, но в каждом заголовке h2 я должен пройти по их родным братьям. Каждый заголовок имеет более 1 братьев и сестер. Сейчас я знаю только, как перейти к одному брату, который использует функцию .next (). Может кто-нибудь, пожалуйста, помогите мне пройтись по списку братьев и сестер без изменения направления моего исходного кода.

<script>
// Code Option 1
    function putSiblingsInTableForEachH2() {
        // line above sets function that will ultimately store siblings of each h2.toggler into a HTML table
        var siblingsGoInTable = [];
        // line creates empty array that will hold elements that will eventually go into HTML table
        var togglerHeaders = $("h2.toggler");
        // line above sets variable togglerHeaders to all h2 elements with a class of ".toggler"
        for (i = 0; i < togglerHeaders.length; i++) {
            // line above is a for loop that loops through variable togglerHeaders (for its entire length)
            var currentH2Element = togglerHeaders[i];
            // line above sets variable currentH2Element to togglerHeaders at position i
            // so when i starts at 0 currentH2Element is set to the first element in togglerHeaders which is the first h2.toggler
            for (j = 0; j < currentH2Element.nextAll(); j++) {
                if (currentH2Element.nextAll() !== currentH2Element.val()) {
                    $(siblingsGoInTable).wrapAll("<table></table>");
                } // line ends if statement
            } // line above closes for loop 
        } // line ends for loop
    } // line ends function
    putSiblingsInTableForEachH2();
    // line above actually runs function
</script>

1 Ответ

0 голосов
/ 29 октября 2018

Вы можете использовать метод .siblings() для достижения этой цели.

Итак, что-то вроде этого может работать для вас:

<script>
    function putSiblingsInTableForEachH2() {
        var siblingsGoInTable = [];

        var togglerHeaders = $("h2.toggler");

        for (var i = 0; i < togglerHeaders.length; i++) {

            var currentH2Element = togglerHeaders[i];

            // Access siblings like this
            var siblings = $(currentH2Element).siblings();

            for (var j = 0; j < siblings.length; j++) {

                var siblingToH2 = siblings[j];
                // Do what you need to do with sibling element here
            }
        }
    }

    putSiblingsInTableForEachH2();

</script>
...