jquery 摘要

001、选择器类型

<script type="javascript">
<!-- 1、相对选择器-->
     $("td", $(this)).css("background", "red");  //$(this)元素下的td   
<!-- 2、多条件选择器-->  
     $("div,span,p[name='p1']")                          //选择div,span,p[name='p1']三种标签
<!-- 3、层次选择器-->
     $("#div li")获取div下的所有li元素(后代,子,子的子....) 
     $("#div > li")获取div下的直接li子元素//注意空格 
     $(".menuitem + div")获取样式名为menuitem之后的第一个div元素
     $(".menuitem ~ div")获取样式名为menuitem之后的所有的div元素
 </script>

001.1伪类选择器

         :first    //集合中的第一个元素 $("ul li:first")

         :last    $("ul li:last")

         :eq(n)    $("ul li:eq(2)")

         :even    //偶数 0 2 4 6 8 。。。

         :odd    //奇数   1 3 5 7 9 。。。

         :lt(n)   <

         :gt(n)   >

         :not(selector)    $("li :not(:first)").hide();

001.2父辈选择器

         parent([selector]);//直接父元素

         parents([selector]);//所有父元素

         parentUtil([selector]);//提供搜索范围

001.3同辈选择器(不包含当前元素)

          next([selector]):获取当前元素的下一个元素,可以指定选择器$("h3").next("li").css("color", "#FCF");

          nextAll([selector]):获取当前元素的所有同辈元素,可以指定选择器

         nextUtil([selector]):获得A到B之间的同辈元素$("#div1").nextUtil("div3").css("border", "1px solid red");

          prv([selector])

          prvAll([selector])

          siblings([selector])

          andSelf();:包含自身

                              $("#div1").nextUtil("div3").css("border", "1px solid red").andSelf();

001.4子类选择器

           children([selector]);:直接子元素

           find(selector);  :参数必选,选择范围为所有子元素

002、属性操作

<script type="javascript">
<!--某元素下具有某属性的子元素-->     
     $("#table02 .trSelected").length;
<!--具有某属性的元素-->
    $("div[name]").length;
<!--具有某属性值的元素-->
     $("div[class='trSelected']").length;
<!--属性字段-->  
    $("img[src^='.jpg']")
    $("img[src!='.pdf']")
    $("img[src$='.jpg']")
<!--多属性字段-->
 $("div[class='trSelected'] [name='ssj']")
</script> 

003、遍历radio

$(document).ready(function() { 
    var ele=$("input[name='exchangelx'][type='radio']").each(function(){
		alert(this.value);
		});  
})

004、jquery初始化函数

(function ($) {})(jQuery);

 005、获得元素个数

$("ul li").length

 006、从集合中排出某元素

$("A").not($(dom)).slideUp('slow');	

007、动态绑定事件

$("scopeDom").delegate("targetDom","click",function(){});
//jquery绑定动态dom事件(在scopeDom范围内为targetDom绑定click事件,
其中选择器仅支持#和.不支持复杂条件)
	

 008、jquery清除同辈中指定的元素

$("#span_qt a:eq(0)").siblings("a").remove();
	<span id="span_qt">  
		<a name="null" href="javascript:void(0);" class="cur" >全部</a>
		<a name="null" href="javascript:void(0);" class="cur" >aaa</a>
		<a name="null" href="javascript:void(0);" class="cur" >bbb</a>
       </span>

 009、jquery方法

       01:get(n);返回dom对象 $("ul li").get(1).css("color", "red"); //这个是错误的

                                                $("ul li").eq(1).css("color", "red"); //这个是正确的

       02、filter(selector);当前集合过滤,区别于find()子集合

       03、not(selector);当前集合下排除

       04、is(selector);判断是否是同一对象

       05、slice(start,[end]);当前集合区间  $("li ").slice(2); 第三个li   $("li ").slice(2,5);前闭后开,  3-4个li

                                                             

 

 

 

 

 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值