码迷,mamicode.com
首页 > Web开发 > 详细

jquery-选择器

时间:2017-07-20 01:02:08      阅读:210      评论:0      收藏:0      [点我收藏+]

标签:class   选择   nbsp   没有   selector   mat   密码   span   address   

var $cr=$("#cr");   jquery 对象

var cr=$cr[0]  ;    Dom对象

var cr=$cr.get(0)  DOM对象获取

if(cr.checked){}  DOM方式判断  ;

if($cr.is(":checked")){}   jQuery方式判断

 

 

jquery和其他库的冲突:

jquery库在其他库之后导入:

jQuery.noConflict();  将变量$的控制权移交给其他库  方法一

var $j=jQuery.noConflict();  自定义一个快捷方式  之后使用jQuery 利用自定义快捷方式 $j(‘#box‘)

$(‘#box‘)  $用作其他js库的使用

jquery库在其他库之后前导入:

jquery直接使用  无需调用 jQuery.noConflict () 函数
 
用jquery 检查某个元素在网页上是否存在时 :if($(‘#box‘)){}  错误;而是 if($(‘#box‘).length>0){} 正确;  或者if($(‘#box‘)[0]){}  转化成DOM对象  正确
 
jquery 选择器:
基本选择器:
#id 选择器
.class  类选择器
element  标签元素选择器
*      通配符选择器
selector1, selector2,selector3  群组选择器
 
层次选择器:
$("div span")  选取div里的所有span(后代)元素
$("div >span")   选取div元素下的元素名是span的子元素
$(".box+div")  选去 class为box 的下一个div同辈元素    等于   $(".box").next("div")
$("#box~div")  选取id为box的元素后面的所有div同辈元素  等于  $("#box").nextAll("div")    注:$("#box").siblings("div")  选取的是所有  同辈节点的div  前后位置无关
 
过滤选择器:
 
基本过滤选择器:
$("div:first ")   选取所有div元素中的第一个div元素
$("div:last")   选取所有div元素中的最后一个div元素
$("input:not(.myclass)")  选取class不是myclass的  input元素
$("input:even")  选取索引是偶数的input元素
$("input:odd")  选取索引是奇数的input元素
$("input:eq(1)")  选取索引等于1的input元素
$("input:gt(1)")  选取索引大于1的input元素
$("input:lt(1)")  选取索引小于1的input元素
$(":header")  选取索网页中所有的  h1  h2 h3....
$("div:animated")  选取正在执行动画的div元素
$(":focus")   选取当前获取焦点的元素
 
内容过滤选择器:
$("div:contains(‘我‘)")   选取含有文本  “我”  的div元素
$("div:empty")   选取不包含子元素(包括文本元素)的div空元素
$("div:has(p)")  选取含有p元素的div元素
$("div:parent")  选取拥有 子元素(包括文本元素)的 div元素
 
可见性过滤选择器:
$(":hidden")   选取所有不可见的元素
$("div:visible")   选取所有可见的div元素 
 
属性过滤选择器:
$("div[id]") 选取拥有属性id的元素 
$("div[title=test]")  选取属性title为 test的div元素
$("div[title!=test]") 选取属性title不等于test的 div元素  注:没有属性title的div元素也会被选取
$("div[title^=test]")   选取属性title以test开始的div元素
$("div[title$=test]")   选取属性title以test结束的div元素
$("div[title*=test]")   选取属性title含有test的div元素
$("div[title|=en]") 选取属性title等于en或者以en为前缀的元素(该字符串后跟一个连字符‘—’)
$("div[title~=‘uk‘]")  选取属性title用空格分隔的值中包含字符uk的元素
$("div[id][title$=‘test‘]") 选取拥有属性ID,并且属性title以test结束的div元素
子元素过滤选择器
:nth-child(index/even/odd/equetion)     index从1 算起 ;     :eq(index)  只匹配一个元素 index从0算起
例:
:nth-child(even)  索引值是偶数的元素
:nth-child(odd)    索引值是奇数的元素
:nth-child(2)   索引值等于2的元素
:nth-child(3n)  索引值是3的倍数的元素
:nth-child(3n+1)  索引值是  3n+1的元素
表单对象属性过滤选择器:
$("#form1 :enabled")  选取id为form1 的表单内的所有可用元素
$("#form1 :disabled")  选取id为form1 的表单内的所有不可用元素
$("input:checked")   选取所有被选中的input元素
$("select option:selected")   选取所有被选中的选项元素
 
表单选择器:
$(":input")  选取所有input, textarea select button 元素
$(":text")   选取所有的单行文本框
$(":password")  选取所有的密码框
$(":radio")   选取所有的单选框
$("checkbox")    选取所有的复选框
$(":submit")    选取所有的提交按钮
$("image")   选取所有的图像按钮
$(":reset")   选取所有的重置按钮
$(":button")   选取所有的按钮
$(":file")   选取所有的上传域
$(":hidden")   选取所有的不可见元素
 
 
 
 
  
 
 
 
 
 
 

 

jquery-选择器

标签:class   选择   nbsp   没有   selector   mat   密码   span   address   

原文地址:http://www.cnblogs.com/jinsuo/p/7203513.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!