JQuery知识补充1

1.DOM加载完成后执行的代码

(1)

$(document).ready(function()
{
 // 开始写 jQuery 代码... }
);

(2)

$(function(){
 
   // 开始写 jQuery 代码...
 
});

2.选择器补充

$("p:first") 选取第一个 <p> 元素
$("ul li:first") 选取第一个 <ul> 元素的第一个 <li> 元素
$("ul li:first-child") 选取每个 <ul> 元素的第一个 <li> 元素
$("[href]") 选取带有 href 属性的元素
$("a[target='_blank']") 选取所有 target 属性值等于 "_blank" 的 <a> 元素
$("a[target!='_blank']") 选取所有 target 属性值不等于 "_blank" 的 <a> 元素
$("tr:even") 选取偶数位置的 <tr> 元素
$("tr:odd") 选取奇数位置的 <tr> 元素

3.基础事件执行间隔与回调

$(selector).hide(speed,callback);
$(selector).show(speed,callback);

可选的 speed 参数规定隐藏/显示的速度,可以取以下值:"slow"、"fast" 或毫秒。

可选的 callback 参数是隐藏或显示完成后所执行的函数名称。

基本上都具有该属性

4.方法链接(多个事件依次执行)

$("#p1").css("color","red").slideUp(2000).slideDown(2000);

效果:颜色先变红,向上2000毫秒内逐渐隐藏,然后向下2000毫秒内逐渐显示

5.遍历

(1)遍历父级

  •     父级(第一父级): JQuery parent()       例:$("span").parent();
  •    所有父级,包含父级以上级别,直到最顶级:JQuery parents()      例:$("span").parents();
  •    介于当前选择器和某个选择器之间的(只能筛选父级及父级以上) JQuery parentsUntil():    例: $("span").parentsUntil("div");

(2)遍历子级

  •        第一级子级:JQuery.children()     例:$("div").children();
  •        返回某个或某些指定子级::JQuery.chidren()       例;  $("div").children("p.1"); 返回类名为1的P标记子元素(是一个返回一个,是多个返回多个)
  •        返回所有子级:JQuery.find()      例:$("div").find(" ")       

(3)水平遍历

  •      返回所有平级元素JQuery siblings();       例:$("h2").siblings();    $("h2").siblings("p");[返回所有平级P标记元素]
  •      返回平级元素位置上的下一个元素:JQuery.next();     例:$("h2").next();
  •      返回平级元素位置上的后面的所有元素:JQuery.nextAll();     例:$("h2").nextAll();
  •      返回两个水平元素之间的所有元素:JQuery.nextUntil();        例:$("h2").nextUntil("h6");

(4)过滤遍历

      返回选取元素中的第一个元素:JQuery.first();     例:$("div p").first();

      返回选取元素中的最后一个元素:JQuery.last();     例:$("div p").last();

      返回选取元素中某个索引元素(索引从0开始):JQuery.eq();   例:$("div").eq(0);

      返回匹配元素,不匹配的会从集合中删除,只在集合中保留匹配元素:JQuery.filter();     例:$("div").filter(".url");[集合中都是带url标签的div]

      返回不匹配元素,与filter相反.JQuery.not();

     

       

       

原文地址:https://www.cnblogs.com/zhangxin4477/p/7416776.html