jQuery选择器

jQuery选择器
1,表格隔行添加样式
$("table tr:nth-child(even)").addClass("striped")
2,带有thisworld类的div元素呈现淡出的效果,并添加新样式removed
$("div.thisworld").fadeOut().addClass("removed")
3,选择id后 进行用html进行替换
$("#someElement").html("i have to....") = $("#someElement")[0].innerHTML="i have to...."
$("#div.fillMeIn").html("i have to...") 等价于
var elements = $("div.fillMeIn");for(i=0;i<elements.length;$i++) elements[i].innerHTML = "i have to..."
4,选择器
$("p:even") 偶数;  $("tr:nth-child(1)") 第一行; $("body > div") 直接子节点的div; 
$("a[href$=pdf]") pdf文件的链接; $("body > div:has(a)") body的直接子节点包含链接a的div;
http://docs.jquery.com/Selectors

实用工具
$.trim(someString)删除前后空格
文档就绪处理 页面完全加载   只接受一个函数
window.onload = function(){$("table tr:nth-child(even)"").addClass("even");}; 
DOM完全加载  优化
$(document).ready(function(){$("table tr:nth-child(even)").addClass("even");};
简化  $(function(){$("table tr:nth-child(even)").addClass("even");};
追加在某id之后
$("<p>Hi there</p>").insertAfter("#follow");
禁用一组表单元素的函数并添加样式
$("form#myFrom input.special").disable().addClass("moreSpecial");
$.fn.disable = function(){return this.each(function(){if (typeof this.disable != "undefined") this disabled = true;});} 不明觉厉
消除第三方库带来的冲突
jQuery.noConfilic();
 
 选择元素包装集
 $("p a.specialClass") 带有某个类的包含着p元素里的a
 ul.myClass li a  ul下所有class类的li里的a链接
 ul.myClass > li > a 直接子节点
 a[href^=http://] 以http开头的href值所有链接
 input[type=text] 类型为text的所有input元素
 div[title^=my]  title特性值以my开头的所有div元素
 a[href$=.pdf] 以pdf结尾
 a[href*=jquery.com] 包含这个值的元素   li:has(a) 
 div:not(li:has(a)) 不存在包含a的li的div元素
 通过位置选择
 a:first 第一个a;  p:odd 奇数; p:even 偶数; li:last-child 最后一个子元素;
 :only-child 没有兄弟节点的所有元素; 
 :nth-child(n) 第n个节点
 :nth-child(even|odd) 偶数或奇数的子节点
 :nth-child(Xn+y) X倍的y项  从1开始
 :eq(n) 第n个匹配元素 0开始
 :gt(n) 第n个匹配元素之后的元素
 :lt(n) 第n个匹配元素之前的元素
table#mou tbody td:first-child == table#mou td:nth-child(1) 
radio.checked   checkbox.checked   选择默认项
选择器
:animated 动态控制
:button 任何按钮
:checkbox 复选框  contains(foo) 选择文本包含foo的元素
:disabled  :enabled 禁用|启用的表单元素
:file   :header   :hidden  :image  :input  :not(filter) 反选
:parent 拥有后台节点的元素  :password  :radio  :reset  :selected   :submit  :text  :visible 可见的元素
:checkbox.checked:enable  组合   input:not(:checkbox) 反选

$("<div class="foo">I have foo</div><div>i don't</div>").filter(".foo").click(function(){alter("i'm foo");}).end().appendTo("#mou") 创建两个元素在.foo上添加事件把他们添加在mou的元素后

$('#some').html('there are '+ $('a').size()+' links on this page.) size()返回元素的个数

$('img[alt]').get(0) == $('img['alt']')[0] 
var allbutton = $('label+button').get() 选择所有临近label的button元素
var n = $('img').index($('img#some'))[0] 返回获取的元素下标
$('img[alt],img[title]'])  or ;
$('img[alt]').add('img[title]'])  添加到包装集 ;


 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值