在 jQuery 中,同胞元素是指和当前元素在同一层级的元素。你可以使用一系列方法来遍历同胞元素。以下是一些 jQuery 遍历同胞元素的常见方法:

1. next() 方法:
   - next() 方法用于获取匹配元素的下一个兄弟元素。
   // 获取所有 p 元素的下一个兄弟元素
   $("p").next().css("color", "green");

2. prev() 方法:
   - prev() 方法用于获取匹配元素的上一个兄弟元素。
   // 获取所有 p 元素的上一个兄弟元素
   $("p").prev().css("color", "blue");

3. nextAll() 和 prevAll() 方法:
   - nextAll() 方法用于获取匹配元素的所有后续兄弟元素,而 prevAll() 方法用于获取匹配元素的所有前面的兄弟元素。
   // 获取所有 p 元素的所有后续兄弟元素
   $("p").nextAll().css("font-style", "italic");

   // 获取所有 p 元素的所有前面的兄弟元素
   $("p").prevAll().css("font-weight", "bold");

4. siblings() 方法:
   - siblings() 方法用于获取匹配元素的所有同胞元素。
   // 获取所有 p 元素的所有同胞元素
   $("p").siblings().addClass("highlight");

5. nextUntil() 和 prevUntil() 方法:
   - nextUntil() 方法用于获取匹配元素的所有后续兄弟元素,但排除指定的元素之后的所有兄弟元素。prevUntil() 方法用于获取匹配元素的所有前面的兄弟元素,但排除指定的元素之前的所有兄弟元素。
   // 获取所有 p 元素的后续兄弟元素,但排除 class 为 "container" 的元素之后的所有兄弟元素
   $("p").nextUntil(".container").css("border", "1px solid red");

   // 获取所有 p 元素的前面兄弟元素,但排除 class 为 "header" 的元素之前的所有兄弟元素
   $("p").prevUntil(".header").css("border", "1px solid blue");

这些方法允许你在 DOM 结构中向前或向后遍历,获取元素的同胞元素。你可以根据具体的需求选择适当的方法。这些方法也可以组合使用,形成更复杂的选择和操作逻辑。记得在使用这些方法时确保已经包含了 jQuery 库。


转载请注明出处:http://www.zyzy.cn/article/detail/4628/jQuery