jQuery基本选择器(实例及表单域value的获取方法)

jQuery基本选择器包括 CSS选择器、层级选择器和、表单域选择器。

1.CSS选择器

（1）标签选择器

$("div")  $("p")  $("table") 等一系列 HTML 标签

（2）ID选择器

获取该标记的值：$("#user").val();

（3）类选择器

给该文本框添加样式：$(".t").css("border","2px solid blue");

（4）通用选择器

$("*").css("color","red"); //给所有元素设置样式

（5）群组选择器

$("div,span,p .styleClass").css("border","1px solid red"); //对所有div、span 及应用 styleClass 类的 p 元素设置边框属性

2.层级选择器

（1）子元素选择器

$("parent > child");

查找父元素下面的所有子元素，不包括孙元素等。

（2）后代元素选择器

$("ancestor descedant");

查找 ancestor 元素的所有子元素、孙元素、重孙元素等。

（3）紧邻同辈元素选择器

$("prev+next");

同辈，且紧跟在 prev 元素后面的元素 next 元素

（4）相邻同辈元素选择器

$("prev~siblings")；

跟在 prev 后且同辈的所有 siblings 元素

3.表单域选择器

（1） :input 选择器

$(":input");

选择所有 input, textarea, select, button 元素。

（2） :text 选择器

$(":text");

选择所有单行文本框 ().

（3） :password 选择器

$(":password");

选择所有密码框 ().

（4） :radio 选择器

$(":radio");

选择所有单选按钮 ().

（5） :checkbox 选择器

$(":checkbox");

选择所有复选框 ().

（6） :file 选择器

$(":file");

选择所有文件域 ().

（7） :iamge 选择器

$(":iamge");

选择所有图像域 ().

（8） :hidden 选择器

$(":hidden");

选择所有隐藏域 () 及 所有不可见元素（CSS display 属性值为 none）。

（9） :button 选择器

$(":button");

选择所有按钮 () 和 ...

（10） :submit 选择器

$(":submit");

选择所有提交按钮 () 和 ...

（11） :reset 选择器

$(":reset");

选择所有重置按钮 () 和 ...

对于表单域选择器，上述均为获取所有某一类型的元素。获取其中某个元素的值，在下面的实例中体现。该实例的运行效果图和代码如下：

  
  
  
  




 

  
文本框
  

  
密码框
  

 
 

  
单选按钮
  

    是
    否
  
  
复选框
  

    水果
    蔬菜
  
 
 

  
图像
  

  
文件域
  

 
 

  
隐藏域
  
（不可见）
  
下拉列表
  

    
      选项一
      选项二
      选项三
    
  
 
 

  
提交按钮
  

  
重置按钮
  

 
 

   
文本区域：
   

 

点击【提交】按钮之后弹出的对话框如下：

以上这篇jQuery基本选择器(实例及表单域value的获取方法)就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。