Javascript 如何使用属性过滤器查找最近的？

我有一张像下面这样的桌子

<table>
    <tr data-depth="0" class="expand level0">
        <td>VR [ <a class="link">2147483646 </a>]
        </td>
    </tr>
    <tr data-depth="1" class="expand level1">
        <td>Business &amp; Industrial [ <a class="link">12576 </a>]
        </td>
    </tr>
    <tr data-depth="2" class="expand level2">
        <td>Healthcare, Lab &amp; Life Science [ <a class="link">11815
        </a>]
        </td>
    </tr>
    <tr data-depth="3" class="expand level3">
        <td>Imaging &amp; Aesthetics Equipment [ <a class="link">92036
        </a>]
    </tr>
    <tr data-depth="2" class="expand level2">
        <td>Heavy Equipment [ <a class="link">177641 </a>]
        </td>
    </tr>
    <tr data-depth="3" class="expand level3">
        <td>Forklifts [ <a class="link">97185 </a>]
    </tr>
    <tr data-depth="2" class="expand level2">
        <td>Printing &amp; Graphic Arts [ <a class="link">26238 </a>]
        </td>
    </tr>
    <tr data-depth="3" class="expand level3">
        <td>Commercial Printing Presses [ <a class="link">26247 </a>]
        </td>
    </tr>
    <tr data-depth="2" class="expand level2">
        <td>Restaurant &amp; Catering [ <a class="link">11874 </a>]
        </td>
    </tr>
    <tr data-depth="3" class="expand level3">
        <td>Concession Trailers &amp; Carts [ <a class="link">67145 </a>]
        </td>
    </tr>
</table>

VR[2147483646]
工商及科技局；工业[12576]
医疗,化验及化验所,；生命科学[11815]
]
影像及；美学设备[92036]
]
重型设备[177641]
叉车[97185]
印刷及；平面艺术[26238]
商业印刷机[26247]
餐厅（&）；餐饮业[11874]
特许拖车及；手推车[67145]

我想获得数据深度=（此tr数据深度）-1的最近行

我找不到使用这个的方法。最近（'tr'）和attr（'data-depth'）=这个.attr（'data-depth'）-1一起使用。

类似这样的东西

JS:

---

演示：

看看这是否符合您的期望-

试一试

---

jsFIDLE

我建议添加一些内容，以便您可以将子行与其父行关联起来。也许可以给每行一个id，然后添加一个数据父id属性。这将使工作更加容易。但是，假设您不能这样做，类似这样的操作应该可以获得作为树中父级的单行：

$('a').click(function(){
    var parentRow = $(this).closest('tr');
    var depth = parentRow.attr('data-depth')-1;
    var parentNode = parentRow.siblings(':lt(' + parentRow.index() + ')').filter('[data-depth=' + depth + ']').last();

    //parentNode now is the row of the tree-parent of the row that was clicked
});

这样做的目的是首先获取所单击行的所有同级，这些同级的索引小于所单击行的索引（因为树中的父节点总是位于子节点之前）。然后，它将该列表筛选为数据深度比单击行的数据深度小1的列表。由于根据单击行上方的树深度，可能会有多个树深度，因此只会得到最后一个。最后一个将与单击的最接近，因此应该是其在树中的实际父级

---

演示地点离什么最近？最近的是一个向上遍历树的祖先方法。你用什么设置

这个

？最接近的锚定标记？你是说当点击标记时？如果我点击锚定标记，它应该显示最接近的tr，数据深度=this.attr（'data-depth'）-1锚定标记值。就像你可以看到父子关系一样。因此，如果我单击子锚点标记，它将显示父锚点标记值

$('a').click(function () {
    var myDataDepth = $(this).closest('tr').attr('data-depth'); // gets the closest depth
    var newDataDepth = myDataDepth - 1; // calculates the new depth
    var itemsWithDataDepth_newDataDepth = $('[data-depth="' + newDataDepth + '"]'); // gets the items with the new depth
    $(itemsWithDataDepth_newDataDepth).each(function(){
        console.log( $(this).find('td').html() ); // prints the new items out
    });
});

$(function () {
    $(".link").on("click", function (e) {
        elem = $(e.target);
        e.preventDefault();
        var _elem = $("tr[data-depth=" 
                    + Number(elem.closest("[data-depth]")[0].dataset.depth - 1) 
                    + "]");
        // do stuff with `_elem`
        console.log(_elem.text());
    });
});

$('a').click(function(){
    var parentRow = $(this).closest('tr');
    var depth = parentRow.attr('data-depth')-1;
    var parentNode = parentRow.siblings(':lt(' + parentRow.index() + ')').filter('[data-depth=' + depth + ']').last();

    //parentNode now is the row of the tree-parent of the row that was clicked
});