zoukankan      html  css  js  c++  java
  • JQuery常用方法

    1)$("selector").map(callback(index,domElement));  //.map()方法 用于将当前匹配元素集合中的每一个元素传入回调函数(callback)中,并返回一个新的jQuery对象,也就相当于通过该方法重组匹配集合内容。其中index是元素索引,domElement是当前索引对应的jQuery对象。
     
    2)$("selector").not(expr);  //.not()方法 用于在匹配selector元素集合中移除指定的集合,expr可以为选择器(selector)也可以是一个函数,若为选择器则在selector集合中移除符合expr的集合;若expr为一个函数,则只有当当该函数返回true时才会移除当前索引对应的jQuery对象。
     
    3)$("selector").add(selector1[,context]);  //.add()方法 该方法是在匹配元素集合中添加selectior1元素,与not()方法的作用相反。其中selector1可以是一个jQuery对象、DOM对象以及HTML标签。而可选参数context是指定要插入上下文的位置
     
    4)$.each(object,callback(indexInArray,valueOfElement));  //.each()方法  用于遍历object数组或对象 ,其中callback是回调函数 注:该方法与$("selector").each(function(){})不同,$.each()方法可以遍历所有的的数组,而$("selector").each(function(){});只能遍历jQuery对象数组。
    var array = [1,2,3,4];
     
    $(array).each(function(index){
        alert(this);
    });
     
    $.each(array,function(index){
        alert(this);
    });
    5)$.contains(container,contained);  //.contains()方法 用于检测一个contained对象是否包含在container对象中,若包含返回true否则返回false。 
    $.contains($("div")[],$("p")[0]);  //检测第一个p标签是不是在第一个div标签内。
    6)$.isEmptyObject(object);  //.isEmptyObject()方法 用于判定一个对象是否为空(不包含任何属性的对象为空),若为空返回true  
    $.isEmptyObject({});  //返回 true 
    $.isEmptyObject({foo:"bar"});  //返回false
    7)$.extend(target,object1);  //.extend()方法 将两个或多个对象的内容合并到第一个对象target中,以实现第一个对象的扩展并返回被修改的对象。
      
    $.extend({foo:"aa"},{bar:"bb"});  //结果为:{foo:"aa",bar:"bb"}
    8)$.browser  //.browser属性 该属性可以获得当前浏览器的版本信息 
    if($.browser.msie) alert("浏览器是IE:"+$.browser.version);
    if($.browser.mozilla) alert("浏览器是Firefox:"+$.browser.version);
    9)$.support  //.support属性  该属性用于战士不同浏览器各自特性和bug的集合
     
    10).parent() 方法允许我们在 DOM 树中搜索这些元素的父元素,沿 DOM 树向上遍历单一层级。
    .parents() 方法允许我们在 DOM 树中搜索这些元素的祖先元素,并用从最近的父元素向上的顺序排列的匹配元素构造一个新的 jQuery 对象。元素是按照从最近的父元素向外的顺序被返回的。
    $(e.currentTarget).parent("ul")//查看父元素,满足条件返回结果,不满足返回为空
    $(e.currentTarget).parents("ul")[0]//返回所有满足条件的祖先元素,[0]表示获取距离最近的一个结果
    11)判断数组元素位置
    $(".js-groupStarResultList:visible").find(".flex-control-nav li a").index($(".flex-active"));
     
    12)在jQuery 1.4.2中,delegate和undelegate选项 
            //被引入代替live,因为它们提供了更好的上下文支持 
            //例如,就table来说,以前你会用
     
        
     //.live() 
        $("table").each(function () {
            $("td", this).live("hover", function () {
                $(this).toggleClass("hover");
            });
        });
           //现在用 
        $("table").delegate("td", "hover", function () {
            $(this).toggleClass("hover");
        });
    13)克隆一个元素
    var cloned = $('#somediv').clone();
    14)在jQuery中如何使用.siblings()来选择同辈元素
     
    // 不这样做
        $('#nav li').click(function () {
            $('#nav li').removeClass('active');
            $(this).addClass('active');
        });
            //替代做法是
    
        $('#nav li').click(function () {
            $(this).addClass('active').siblings().removeClass('active');
        });
     
     
    15)检查图像是否已经被完全加载进来
    $('#theImage').attr('src', 'image.jpg').load(function () {
            alert('This Image Has Been Loaded');
          });
     
     
     
  • 相关阅读:
    HTML标签和属性三
    HTML标签和属性二
    HTML标签和属性一
    小程序相关面试题
    Vue路由的hash模式与history模式的区别?
    android中VideoView播放sd卡上面的视频
    Android中app开机自启动的开发
    java中byte,byte[]和int之间的转换
    Android多activity启动两种方式浅谈
    Android开发用到的几种常用设计模式浅谈(一):组合模式
  • 原文地址:https://www.cnblogs.com/chenlogin/p/5103783.html
Copyright © 2011-2022 走看看