jQuery选择器

标签选择器

  /* 标签选择器 /*
/* css方法 第一个参数是属性 第二个参数是值 都是字符串类型 */
           $('p').css('background','red')
          /*  类选择器 */
   $('.p1').css({'background':'green','fontSize':'30px'})
   /* id选择器 唯一的 只要有一个id选择器其他同名的就不生效了*/
           $('#p1').css('background','red')
           /* 并集选择器 */
            $('#p1,.p1').css('background','red')
            /* 等同于下面 */
            $('#p1').css('background','red')
            $('.p1').css('background','red')
             /* 全局选择器 */
            /* 属性值 支持数字和字符串 */
            $('*').css({margin:0,padding:0})
             $('*').css('margin',0)
             $('*').css('padding',0)

层次选择器

/* 后代选择器 */
         $('ul p').css('background','red');
         /* 子级选择器 */
         $('ul > p').css('background','red');
         $('li > p').css('background','red');
         /* 相邻选择器用来选取紧邻目标元素的下一个元素 */
         $('p+li').css('background','red');
         /* 同辈选择器用来选取目标元素之后的所有同辈元素 */
         $('p ~ li').css('background','red');
         

属性选择器

• 属性选择器可以根据是否包含某属性来选取元素
• 表示属性 选取属性是href的a标签

/* 根据属性的值来选取元素 */
        $('a[class=a1]').css('color','red')
        /*选取不等于属性是某个特定值的元素 */
        $('a[class!=a1]').css('color','red')
        /* 指定属性值以指定值开头的元素 */
         $('a[href^=www]').css('background','red')
/* 指定属性值以指定值结尾的元素 */
         $('a[href$=com]').css('background','red')
         /* 指定属性值包含指定值的元素 */
        $('a[href*=baidu]').css('background','red')