jQuery遍历prev()方法使用介绍

jQuery 的 prev() 是查找前一个同级。

直接点是当前元素之前的同级元素。

例如，如果要查找目标 id 的 li 之前的 li，则编写：
$('target').prev();
如果要查找前一个 li，而且该 li 也必须是 item 类型，则添加过滤条件：
$('target').prev('.item');
记住，prev() 只查找紧邻的前一个，而不是所有前面的。
如果要查找之前的所有内容，则必须使用 prevAll()。

易于使用，快速提前确定您的位置，不会出错。

jquery怎么获取上一个兄弟元素

大家好，我在使用 JavaScript 和 jQuery 操作 DOM 元素方面拥有丰富的经验。
我记得有一次在一个项目中，我需要动态地向网页添加一些元素。
当时我用原生JS写了这样的东西：
javascript var s = document.getElementById('id'); var par = s[xss_clean]; // 获取s的父节点 var ns = s.nextSibling; // 获取s的下一个兄弟节点 var ps = s.previousSibling; // 获取s的前一个兄弟节点 var fc = s.firstChild; // 获取s的第一个子节点
当时我还在想，为什么这段代码这么复杂，要记住这么多节点关系。
然后我发现了 jQuery。
哇，这更容易了。

JavaScript $(ele).parent(); // 父节点 $(ele).prev(); // 前一个兄弟节点 $(ele).next(); // 下一个兄弟节点
jQuery 适合那些不想编写太多 DOM 操作代码的人。
不过，话虽这么说，用原生 JS 编写代码可能会让您更好地理解浏览器的工作原理。
然而，jQuery却是快速开发的一大帮手。

请问您遇到过这样的情况吗？例如，当将 .next() 或 .prev() 与 jQuery 一起使用时，您可能会收到未知的？信息。
这是因为节点之间可能不存在任何兄弟节点。
此时，你需要小心，避免因为小错误而导致你的代码崩溃。

顺便说一下，我最近在研究Vue.js，觉得还蛮有趣的。
使用 DOM 很容易，但需要一些时间来适应。
然而，学习技术是一个不断尝试和犯错的过程。
哈哈，这就是我的经历！

jquery查找指定元素

上周 jQuery 找到许多元素。

1 .标签名称。
$('div') 是这样写的。
例如，查找所有
。
它指的是 jQuery 对象。
您可以添加样式。
他们当然可以被束缚。

2 班级名称。
$('.my-class'). 通过一堂课找到它们。
统一的流程。
添加示例动画。

3 ID。
$('独特的'). 你的是独一无二的。
是准确找到的。
事实上，开发商寻求的是被追赶。

4 归因 1 . [标题]。
查看一个标题属性。
2 . [类型=“文本”]。
您将找到文本的类型。

5 赫伦纽斯 1 .儿童元素>。
$('ul>li'). 找出李的儿子。
2 . 下降。
$('div p'). 您将在 div 下找到所有 p。
3 . 相邻+ $('li+li'). 去寻找邻居。
4 . 兄弟 $('h2 ~p'). 您会在同一帖子 h2 中找到所有 p。

有很多方法。
这就够了。
他们永远不知道

如何使用JQ nextUntil以及其他方法筛选4个td的tr元素之间所有2个td的tr元素？

哎呀，这个筛选问题听起来挺复杂的，但是我们得一步步解决。

首先我们需要找到这些具有四个 td 的 tr 元素。
使用 jQuery 这非常容易。
只需使用 .find('td') 即可查看有多少个 td。

然后我们每隔两个dtr寻找这四个dtr，直到出现下四个dtr。

方法一：递归调用nextUntil。
这个方法相当有趣，但是请注意，原始代码的逻辑似乎有问题，需要更正。
您需要确保递归不会无限循环，并且需要正确处理链式调用。

更正后的代码可能如下所示：
Javascript 函数 findNext2 TdTrs(startTr) { 让当前 = startTr.next(); 常量结果 = []; while (current.length && current.find('td').length !== 4 ) { if (current.find('td').length === 2 ) { 结果.push(当前); } 当前 = 当前.next(); } 返回结果；
然后我们使用这个函数来迭代所有 tr 元素。
一旦找到四个 td 的 tr，我们就调用此函数来查找以下两个 td 的所有 tr。

方法二：nextUntil与Filter结合使用。
这个方法看起来比较简洁。
nextUntil 可以查找当前元素之后的所有同级元素，直到找到匹配的选择器。
我们可以用这个函数求出接下来四个td的tr，然后用filter过滤掉这两个td的tr。

代码可能如下所示：
Javascript $('tr').each(function() { 常量 $tr = $(this); if ($tr.find('td').length === 4 ) { const $nextTrs = $tr.nextUntil('tr:has(td:nth-child(4 ))'); console.log($nextTrs); } });
方法三：使用map和filter的结合，可以更加结构化的方式输出结果。
我们首先找到所有四个 td 的 Tr，然后为每个 tr 找到所有两个后续 td 的 Tr。

代码可能如下所示：
Javascript const tr4 List = $('tr:has(td:nth-child(4 ))'); const 结果 = tr4 List.map(function() { 常量 $tr4 = $(this); const $tr2 s = $tr4 .nextUntil(function() { 返回 $(this).find('td').length === 4 ; }). 过滤器(函数() { 返回 $(this).find('td').length === 2 ; }); 返回 { tr4 : $tr4 , tr2 s: $tr2 s }; }).get(); console.log(结果);
方法4 、纯循环实现。
这种方法兼容性最好，适合较旧的浏览器版本。
我们首先收集所有四个td的tr，然后逐个处理后续元素。

代码可能如下所示：
Javascript const tr4 Elems = []; $('tr').each(function() { if ($(this).find('td').length === 4 ) { tr4 Elems.push($(this)); } }); tr4 Elems.forEach($tr4 => { 让 $current = $tr4 .next(); while ($current.length && $current.find('td').length !== 4 ) { if ($current.find('td').length === 2 ) { 控制台.log($当前); } $当前 = $当前.next(); } });
需要记住的事情：需要优化选择器、考虑性能并处理边缘情况。
综上所述，推荐使用方法2 或方法3 ，代码简洁，易于维护。
如果需要处理复杂的结构或者兼容旧的浏览器，可以选择方法四。
标签： jQuery prev()