jquery选择器

jquery的选择器与css的选择器的作用是完全一样的,目的是精确快速的定位到某个html元素上并获取该元素对象,进而使用jquery的方法对该html进行操作.

jquery常用的选择器有如下几个:基本选择器,基本过滤选择器.属性选择器,表单属性选择器.层级选择器等.

基本选择器

标签选择器(元素选择器)😒("html标签名")

id选择器;$("#id的属性值")

类选择器:$(".class的属性值")

复制代码

复制代码
层级选择器

获得A元素内部的所有的B元素：$("A B ") --- 后代选择器
获得A元素下面的所有B子元素：$("A > B")
获得A元素同级下一个B元素：$("A + B")
获得A元素同级所有后面B元素：$("A ~ B")

复制代码

复制代码
属性选择器

获得有属性名的元素：$("A[属性名]")
获得属性名 等于 值 元素：$("A[属性名=值]")
复合属性选择器，多个属性同时过滤：$("A[属性名!=值][属性名!=值][属性名!=值]")

复制代码

复制代码
基本过滤选择器

不包括指定内容的元素例如： :not(selecter)
偶数，从 0 开始计数： :even
奇数，从 0 开始技术： :odd
指定第几个： :eq(index)
大于n个： :gt(index)
小于n个： :lt(index)
获得标题 （

/

.... ） :header --- 固定写法
获得动画的 :animated ---固定写法 正在执行的动画

复制代码

复制代码
表单属性选择器

可用： :enabled
不可用： :disabled
选中（单选radio ，多选checkbox）： :checked
选择（下列列表

$("#b1").click(function(){
//获取多个input标签属性值是 enabled, type属性值是text 返回数组
var $inputs = $("input[type='text']:enabled");
for(var i=0;i<$inputs.length;i++){
//把数组中的DOM对象变成Jquery对象,调用方法val()
alert($($inputs[i]).val());
}
});
//

$("#b2").click(function(){
//获取多个input标签属性值是disabled,返回数组
var $inputs = $("input[type='text']:disabled");
for(var i=0;i<$inputs.length;i++){
//把数组中的DOM对象变成Jquery对象,调用方法val()
alert($($inputs[i]).val());
}
});
//

$("#b3").click(function(){
var $inputs = $("input[type='checkbox']:checked");
alert($inputs.length);
});
//

/*

• html()==DOM对象的innerHTML
• text()==DOM对象的innerText
  */
  $("#b4").click(function(){
  var $inputs = $("option:selected");
  for(var i=0;i<$inputs.length;i++){
  alert($($inputs[i]).text());
  }
  });