经过了十一长假,大家学习的状态怎么样呢?有没有一如既往的保持学习劲头呢?小编在假期去SAE和BAE上面逛了逛,研究了一下微信公众号服务器配置,无奈的是如果启用服务器原来自定义的菜单等应该就暂时报销了。。。所以小编没有下手,所以又花时间去网罗了一些微信小程序的相关教程和资料,说白了就是前端的教程了,然后我们的鹏宇大校长又分享了虚拟机装黑苹果的方法,感觉收益颇丰啊。(如果对C/C 感兴趣的同学可以找鹏宇校长进行业内顶级特训哦)
好啦,转眼间假期嗖嗖嗖的就结束了,大家还是要劳逸结合的,现在开始我们的第四期,前两期介绍了基本选择器和层次选择器中的一些常用用法,本期向大家介绍基本过滤选择器,所谓过滤就是按条件选择出自己所需的元素,用法更为灵活,也增加了一定的复杂度,下面一起来看看吧。
第一发:首尾元素
原始效果图如下:
当我们想获得第一个div元素时可使用如下代码$("div:first").css("background","#bbffaa");执行效果如下:
需要注意的一点是前面的div为标签选择器,大家可以用之前学过的知识组合使用,通过和冒号后的first搭配使用得到想要的效果。获得末尾元素的代码如下$("div:last").css("background","#bbffaa");执行效果如下:
第二发:奇偶元素
在某些情境下,我们需要交替选取元素,这就可以用到奇偶的选择器,原始效果图如下:
选取索引为奇数的元素$("div:odd").css("background","#bbffaa");执行效果如下:
这里要注意一点,如果前面的选择器写的不好或范围过大,可能会造成子父级元素都被选择的情况,如上例中所示,但是元素会按照由上到下的顺序(即文档加载顺序)进行索引的排列,使用时应注意。
选取索引为偶数的元素$("div:even").css("background","#bbffaa");执行效果图如下:
索引为0的元素自然是包含在偶数当中,今天所讲的都是在冒号后面的进一步筛选,希望大家集合前面的知识搭配使用才能发挥真正的作用。最后小编祝大家学业有成,工作顺利!