选择两个元素之间的某些元素[jQuery]

Question

我想知道是否可以选择某些元素，在两点之间爬行DOM。

以下是树的示例，我希望从data-tagname开始到input结束，选择具有.parent属性的所有$('input').each(function(){ $(this).attr('name', $(this).parent().parent().prev('[data-tagname]').attr('data-tagname') + '_' + $(this).prev('[data-tagname]').attr('data-tagname'); //etc... }); 。然后想法是将其设置为输入的名称，即name =“diary_hours_monday_start”。

我可以通过特定方式执行此操作，例如：

{{1}}

但显然这个解决方案很糟糕，而且结构并不总是相同的（有些元素嵌套5次，其他元素2次）。

TL; DR

我正在寻找一个解决方案，沿着从A点遍历DOM树，过滤好的东西，然后在B点停止。也许我们从A到B并推动我们所有的元素'我选择了一个空阵列？

Answer 1

您可以使用.parentsUntil()函数遍历每个INPUT到第一个LI.parent的DOM：

$('input').each(function() {
    var $this = $(this);
    var name = $this
        .parentsUntil($this.closest('li.parent').parent(), 'li')
        .map(
            function() { 
                return $(this).find('> label:first').attr('data-tagname');
            }
        )
        .toArray()
        .reverse()
        .join('_')
    ;

    $this.attr('name', name);
});

由于您想要包含第一个LI.parent，我们使用其父作为.parentsUntil()的第一个参数。

然后我们使用.map()聚合所有data-tagname属性，将它们转换为数组，颠倒顺序，并使用_作为分隔符将它们连接成一个字符串。

最后，我们将每个INPUT的名称设置为该名称字符串。在您的示例中，"diary_hours_monday_start"。