首页 前端知识 jQuery选择器

jQuery选择器

2024-02-29 12:02:10 前端知识 前端哥 467 600 我要收藏

一、兄弟选择器

1、查找下一个兄弟元素

 $(".box span").css("color", "#f00");
//   $(".box").next().css("background-color", "#00f");
//   $(".box").next("span").css("background-color", "#0ff");

2、 查找上一个兄弟元素

$(".box").prev().css("color", "#f0f");
 //   $(".box").prev("span").css("color", "#0f0");

3、查找兄弟上面所有的span

$(".box").prevAll("span").css("background-color", "green");

4、查找兄弟下面所有的span

$(".box~span").css("color", "gold");
//   $(".box").nextAll("span").css("color", "#999");

5、 查找兄弟下面所有的

$(".box").nextAll().css("color", "green");

6、 查找兄弟上面所有的

$(".box").prevAll().css("background-color", "green");

 7、siblings()

Query对象.siblings() 选择器除了自身之外的其他兄弟jQuery对象 

二、 过滤选择器

first元素

         $("ul li:first").css("color", "#f00"); //文档里的第一个li元素 唯一

         $("ul li").first().css("color", "blue");

         $("li").eq(0).css("color", "#f00");

last元素

        $("ul li:last").css("color", "#f00"); //文档里的最后一个li元素 唯一

         $("ul li").last().css("font-size", "20px");

$("ul li:first-child").css("color", "#f00"); //每一组里的第一个li元素 可能有多个

$(

转载请注明出处或者链接地址:https://www.qianduange.cn//article/2973.html
标签
评论
发布的文章

JQuery中的load()、$

2024-05-10 08:05:15

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!