JQuery получить элемент родителя

Question

Я пытаюсь получить родительский элемент элемента с кодом ниже.

(содержимое родительского элемента)

ex.родительский элемент «Item 1.1» будет «Item 2» в следующем примере.

Items:

        <ul class="sortable" id="page-list">

            <li><div>Item 1</div></li>
            <li><div>Item 2</div>
                <ul>
                    <li><div>Sub Item 1.1</div></li>
                    <li><div>Sub Item 1.2</div></li>
                    <li><div>Sub Item 1.3</div></li>
                    <li><div>Sub Item 1.4</div></li>
                </ul>
            </li>

        </ul>

Javascript:

            function saveNewList() {
            //get DIV contents in order
            var divContents = [];
            $("ul.sortable > li div").each(function() { divContents.push($(this).text()) });
            var quotedCSV = '"' + divContents.join('", "') + '"';
            $("#results").text(quotedCSV);
            //get DIV parents' contents in order
            var divParents = [];
            // something needs to go here...
            var quotedCSVparents = '"' + divParents.join('", "') + '"';
            $("#results2").text(quotedCSVparents);


        }

Answer 1

родительским элементом «Sub Item 1.1» является технически тег <li>, обернутый вокруг него:

<li><div>Sub Item 1.1</div></li>

но вы можете использовать .parent(), чтобы подняться на ступень в иерархии:

$([selector that targets <div>sub item 1.1</div>]).parent().parent().parent().find('div')

первый .parent() приведет вас к <li> 2-й приведет вас к <ul>3-ий переводит вас к основному <li>, а .find('div') возвращает вас к <div>Item 2</div>

Answer 2

$(this).parents('li:has(ul)').children('div:first').text();

Это будет проходить до ближайшего <li>, который имеет суб <ul>, затем до его первого <div> дочернего элемента и получит текст.

Это также получит текст, когда вы находитесь в верхнем элементе <li>. Это желательно? Если нет, просто добавьте .parent() вот так:

$(this).parent().parents('li:first').children('div:first').text();

Следует избегать получения текста, когда вы не во внутреннем <li>.