jquery 选择器

原创 2012年03月21日 22:07:13

1、内容选择器:

 1):contains(text):匹配包含给定文本的元素

        将含有two的div背景变为绿色

        $("div:contains(two)").css("background","green");


 2):empty:匹配所有不包含子元素或者文本的空元素

        将不含有子元素或文本的空元素背景变为绿色

        $("div:empty").css("background","green");


 3):has(selector):匹配含有选择器所匹配的元素的元素

        将含有span的div背景变为绿色

        $("div:has(span)").css("background","green");


 4):parent:匹配所有的子元素或文本的元素

       将含有子元素(或者文本内容)的div背景变为绿色

       $("div:parent").css("background","green");



2、可见性选择器:

    1)、hidden:匹配所有的不可见元素,input 元素的 type 属性为 "hidden" 的话也会被匹配到   隐藏的元素也可以用show()显示出来;

    2)、visible:匹配所有的可见元素



2、属性选择器:

       1)、选中拥有属性id的div元素 $('div[id]')
      
       2)、选取拥有title等于str值的div元素 $('div[title='nihao']')
    
       3)、选取拥有title不等于str值的div元素 $('div[title!='nihao']')    
       
       4)、选取拥有title属性以str值为开头的div元素 $('div[title^='nihao']')
         
       5)、选取拥有title属性以str值为结尾的div元素 $('div[title$='nihao']')
                
       6)、选取拥有title属性包含str值的div元素 $('div[title*='nihao']')

       7)、选取选中class等于cc,id=one的元素  多个属性限制这样弄  $('div[class=cc][id=one]')
           

3、jquery遍历问题:用each遍历

格式1: $("div").each(function (i){
                   alert(this.value);
              });
                                  解析:   

                                                      :         这里的i为数组下标从0开始,到数组的长度
                                                 this  :         this 表示该jquery返回的对象,但是该对象不是jquery对象而是domduixiang         
        
        
格式2
    $('input').each(function (index,dom){
            alert(index+dom.value);
            index==i
            dom=this
        });
       


格式3
    var input = $("input:hidden");
       只不过这里的each遍历的是这个input数组
    $.each(input,function (index,domEle){
        alert($(domEle).val());
    });


版权声明:本文为博主原创文章,未经博主允许不得转载。

jQuery-9种选择器

jQuery 9种选择器   1、基本选择器-5个    1 html> 2 head> 3 meta http-equiv="content-type" conte...
  • zfs592645357
  • zfs592645357
  • 2014年10月30日 16:20
  • 1179

JQuery_九大选择器

JQuery中九大选择器。
  • pseudonym_
  • pseudonym_
  • 2017年07月25日 18:19
  • 373

Jquery选择器分类(基本选择器,层次选择器,过滤选择器,表单选择器)

基本选择器 说明:通过元素id、class和标签名等来查找DOM元素 1.id选择器:$("#test");//选取id为test的元素 2.类选择器:$(".test");//选取所有class为...
  • allan492975230
  • allan492975230
  • 2013年08月01日 15:50
  • 1131

jQuery与CSS3的选择器

jQuery与CSS在选择器方面,有很多的相似之处,本文稍加总结。 注:本文以jQuery1.9.1版本和CSS3为例进行说明,CSS在选择器方面存在兼容问题,请自行分辨。1 jQuery的版本 ...
  • aiolos1111
  • aiolos1111
  • 2016年08月02日 16:52
  • 1833

jquery 孩子和兄弟选择器

Jquery 孩子和兄弟选择器分为4类,1 后代选择器(A B) ;2 孩子选择器(A>B) ;3相邻兄弟选择器(A+B); 一般兄弟选择器(A~B). 以下让我们通过一个例子来理解它们的不同。  ...
  • taiyb
  • taiyb
  • 2014年10月30日 23:16
  • 9139

jQuery 层次选择器,属性选择器

jQuery层次选择器 jquery属性选择器 jq根据是否有某属性选择 jq选取子元素、后边的元素等 $("div >span") $("#one +div") $("#one~div")...
  • tangdou5682
  • tangdou5682
  • 2016年12月01日 10:40
  • 540

javascript 原生 模仿 jquery 选择器 代码

使用这段代码可以简单的实现类似 $(“#tab_ul”) 选择器效果。当然,是基于原生的。 Array.prototype.each=function(f){ for(var ...
  • FungLeo
  • FungLeo
  • 2015年09月09日 14:36
  • 1427

详解jQuery选择器正则表达式

1、空白 whitespace = "[\\x20\\t\\r\\n\\f]", 在字符串中,斜杠是用于转义的,若想输出斜杠,必须采用双斜杠来表示。上述字符串若直接用正则表达式对象来表示,如下: ...
  • mole
  • mole
  • 2015年02月02日 18:26
  • 3222

jquery选择器扩展之样式选择器

jquery中提供了丰富多样的选择器,利用这些选择器我们可以完成大多数任务,但是喜欢思考的我们总得找点事,提问时间: 1.如何选择所有字体颜色为红色的元素 2.如何选择出背景颜色为为白色的元素 3.如...
  • duwen90
  • duwen90
  • 2016年01月23日 18:05
  • 1460

JQuery中的特殊选择器--this

相信很多刚接触jQuery的人,很多都会对$(this)和this的区别模糊不清,那么这两者有什么区别呢?下面我们一起来看一下! this是JavaScript中的关键字,指的是当前的上下文对象,简单...
  • LHJBK
  • LHJBK
  • 2016年05月30日 21:16
  • 1130
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:jquery 选择器
举报原因:
原因补充:

(最多只允许输入30个字)