zoukankan      html  css  js  c++  java
  • jquery选择器总结

    //基本选择器
            $("#one").css("background","#ddffdd");//改变ID为one的背景色
            $(".mini").css("background","#ddffdd");//改变class为mini的背景色
           $("div").css("background","#bbffaa");//改变元素为div的背景色
            $("*").css("background","#aaffbb");//改变所有元素的背景色
            $("span,#two").css("background","#ffcccc");//改变所有元素为<span>标签Id为two的背景色
            $("body div").css("background","#ccffcc");//改变body里的所有的div的背景色
            $("body > div").css("background","#ffccff");//改变body下的所有的div的背景色
            $(".one + div").css("background","#cccccc");//改变class为one的下一个div的背景色
            $(".one").next("div").css("background","#ff0000");//同上
            $("#two ~ div").css("background","#ddaacc");//改变ID为two的后面所有的div兄弟的背景色
            $("two").nextAll("div").css("background","#00ff00");//同上
            $("#two").siblings("div").css("background","#ff0000");//改变ID为two的前面和后面所有的div兄弟的背景色

            //过滤选择器        
            $("div:first").css("background","#00ff00");//改变div元素中第一个div元素背景色
            $("div:last").css("background","#ff0000");//改变div元素中最后一个div元素背景色
            $("div:not(.one)").css("background","#0000ff");//改变div class不是one的背景色
            $("div:even").css("background","#ffff00");//改变索引为偶数的div元素的背景色
           $("div:odd").css("background","#00ffcc");//改变索引为奇数的div元素的背景色
           $("div:eq(3)").css("background","#cc0000");//索引为3的div元素的背景色
            $("div:gt(3)").css("background","#00cc00");//索引大于3的div元素的背景色
           $("div:lt(3)").css("background","#0000cc");//索引小于3
            $(":header").css("background","#ddccaa");//改变所有标题的背景色<h1><h2>...<h6>
            

            //可见性过滤选择器
            $("div:visible").css("backgroundColor","#FF6500");//改变所有可见性div的背景颜色
            $("div:hidden").show(3000);//显示隐藏的div元素,show(毫秒)方法是jQuery对象方法,主要用来显示
            

            //属性过滤选择器
            $("div[title]").css("backgroundColor","#aaffbb");//改变含有title属性的div的背景色
           $("div[title=test]").css("backgroundColor","#aaffbb");//改变属性title值为test的div的背景色
            $("div[title!=test]").css("backgroundColor","#aaffbb");//改变属性title值不等于test的div的背景色
           $("div[title^=te]").css("backgroundColor","#aaffbb");//改变属性title值以te开头的div的背景色
           $("div[title$=est]").css("backgroundColor","#aaffbb");//改变属性title值以est结束的div的背景色
            $("div[title*=es]").css("backgroundColor","#aaffbb");//改变属性title值含有es的div的背景色
            $("div[id][title*=es]").css("backgroundColor","#aaffbb");//改变属性含有id且title值含有es的div的背景色

  • 相关阅读:
    canvas背景粒子动态变化动画
    点击屏幕弹出心形效果
    前端图片的性能优化
    vue的computed和method的区别
    es6的...
    命名路由和命名视图
    编程式路由
    [思维]蚂蚁感冒
    [模板]前缀树 / 字典树及应用
    [模板]三分搜索
  • 原文地址:https://www.cnblogs.com/tiandjnet/p/3036360.html
Copyright © 2011-2022 走看看