`

jquery utilities

阅读更多
utilities有些特别, 并不是jquery对象的方法, 需要用jQuery.的方式调用,有些像静态方法。因此很容易想到那些xxUtil的静态方法工具类。

jQuery.each( object, callback )
首先这种方式跟$().each() 不同, $().each()只能对jquery对象进行迭代,而jQuery.each()可以对anything
object指定迭代的对象, callback指定handler;如果callback中返回false,将打断循环。
看一个例子:
    var arr = [ "one", "two", "three", "four", "five" ];
    var obj = { one:1, two:2, three:3, four:4, five:5 };

    jQuery.each(arr, function(i, val) {
      alert(i); //it's the index
      alert(this); alert(val);
      return (this != "four"); // will stop running to skip "five"
    });

    jQuery.each(obj, function(i, val) {
       alert("key is "+i);
       alert("val is "+val);
    });

通过例子,可以看出callback可以有两个参数: index, val
对于数组的遍历很容易理解, 如果是一个hash对象,那么index代表key。
而且这两个参数是可以不写的, this等价于val, 没有写val参数的时候,可以用this获取它的值。

jQuery.extend( target, object1, objectN )
用object1...objectN对target对象进行扩展, 相同属性将被覆盖。
var settings = { validate: false, limit: 5, name: "foo" };
var options = { validate: true, name: "bar" };
jQuery.extend(settings, options);

settings将会变成{validate:true, limit:5, name:"bar"}

jQuery.grep( array, callback, invert )
可以用来塞选一组对象, callback决定是否保留对象
function callback(elementOfArray, indexInArray) {
  var shouldKeepIt;

  this; // unmapped

  return shouldKeepIt;
}

可以看出, index的位置跟each不同, 跑到了第二个参数的位置。
默认情况下, 当callback 返回true则保留对象,否则去掉
invert=false, 跟默认情况一致,callback返回true则保留
invert=true,则跟默认相反,callback返回true则去掉

jQuery.makeArray( obj )
将dom的element数组转成jquery的数组,例如:
    var arr = jQuery.makeArray(document.getElementsByTagName("div"));
    arr.reverse(); // use an Array method on list of dom elements
    $(arr).appendTo(document.body);  	

以上实现了div数组倒置,通过makeArray之后得到jquery数组对象,通过jquery对象的方法,很方便进行倒置,轻松添加到body。

jQuery.map( array, callback ) Returns: Array
不是将数组转换map,而是将数组转换成另外一种形式, callback指定了转换方式,例如:
var arr = [ "a", "b", "c", "d", "e" ]
    $("div").text(arr.join(", "));

    arr = jQuery.map(arr, function(n, i){
      return (n.toUpperCase() + i);
    });
    $("p").text(arr.join(", "));

    arr = jQuery.map(arr, function (a) { return a + a; });
    $("span").text(arr.join(", "));

以上两次map,arr得到如下数组
A0, B1, C2, D3, E4
A0A0, B1B1, C2C2, D3D3, E4E4
两次map,callback的写法有不同
1)两个参数,分别是数组中一个元素的值和index
2)一个参数, 数组中一个元素的值。

jQuery.inArray( value, array ) Returns: Number
返回value在array中的index,如果不存在则返回-1

jQuery.unique( array ) Returns: Array
去掉array重复元素, 并返回去掉重复元素之后的array

jQuery.isFunction( obj )
检查obj是否是一个function,例如:
    function stub() {
    }
    var objs = [
          function () {},
          { x:15, y:20 },
          null,
          stub,
          "function"
        ];

    jQuery.each(objs, function (i) {
      var isFunc = jQuery.isFunction(objs[i]);
      $("span:eq( " + i + ")").text(isFunc);
    });


jQuery.trim( str )
去掉string首尾的空格
分享到:
评论

相关推荐

    jQuery Utilities 分类下的函数(或属性)的实现方式分析

    NULL 博文链接:https://xxing22657-yahoo-com-cn.iteye.com/blog/1046153

    jQuery1.11.0_20140330_jquery_

    jQuery是一个JavaScript函数库。jQuery是一个轻量级的"...jQuery库包含以下功能: HTML 元素选取 HTML 元素操作 CSS 操作 HTML 事件函数 JavaScript 特效和动画 HTML DOM 遍历和修改 AJAX Utilities

    jquery.validate Validation .js验证框架 帮助 手册 文档 chm

    四、实用工具(Utilities) 8 (五)验证器 (jQuery validation) 8 (六)内置验证方法 (jQuery validation) 10 (七)注意事项 (jQuery validation) 16 (八)应用实例 (jQuery validation) 17 出处地址:...

    jQuery UI Cookbook (pdf + ePub)

    Built-in event-handling utilities for inter-widget communication Extend widgets to provide the missing behavior your application needs Extend and improve the design of each widget using the theme ...

    jQuery 1.5 API 中文版

    Utilities Browser and Feature Detection objjQuery.support objjQuery.browserdeprecated strjQuery.browser.versiondeprecated booljQuery.boxModeldeprecated Basic operations objjQuery.each( obj, fn( index,...

    jQuery Design Patterns(PACKT,2016)

    jQuery solves the problems of DOM manipulation, event detection, AJAX calls, element selection and document queries, element attribute and data management, as well as object management utilities....

    jquery-3.4.1.min.zip

    jQuery 库可以通过一行简单的标记被添加到网页中。jQuery是一个JavaScript函数库。 jQuery是一个轻量级的"写的少,做的多"的JavaScript库。...Utilities 提示: 除此之外,Jquery还提供了大量的插件。

    jQuery1.7.2 js+帮助文档

    jQuery1.7.2 jQuery 是一个 JavaScript 函数库。 jQuery 库包含以下特性: HTML 元素选取 HTML 元素操作 CSS 操作 HTML 事件函数 JavaScript 特效和动画 HTML DOM 遍历和修改 AJAX Utilities

    jquery-1.11.0.min.zip

    jQuery是一个JavaScript函数库。 jQuery是一个轻量级的"写的少,做的多"的JavaScript库。 jQuery库包含以下功能: HTML 元素选取 HTML 元素操作 CSS 操作 HTML 事件函数 JavaScript 特效和动画 ...Utilities

    jquery-1.11.3.js

    jquery-1.11.3 - 特性 HTML 元素选取 HTML 元素操作 CSS 操作 HTML 事件函数 JavaScript 特效和动画 HTML DOM 遍历和修改 AJAX Utilities

    jquery.validate Validation .js验证框架 帮助 手册 文档.doc

    四、实用工具(Utilities) 8 (五)验证器 (jQuery validation) 8 (六)内置验证方法 (jQuery validation) 10 (七)注意事项 (jQuery validation) 16 (八)应用实例 (jQuery validation) 17 出处地址:...

    jQuery UI 1.8 (英文版PDF)

    Chapter 2: The CSS Framework and Other Utilities 25 The files that make up the framework 25 jquery.ui.all.css 27 jquery.ui.base.css 27 jquery.ui.core.css 27 The individual component framework files 29...

    JQuery学习总结

    jQuery库包含以下功能: HTML 元素选取、HTML 元素操作、CSS 操作、HTML 事件函数、JavaScript 特效和动画、HTML DOM 遍历和修改、AJAX、Utilities 提示: 除此之外,Jquery还提供了大量的插件。

    jQuery 1.6 中文API

    jQuery 是一个 JavaScript 函数库。 jQuery 库包含以下特性:HTML 元素选取 HTML 元素操作 CSS 操作 ... AJAX Utilities 而本API文档是JQuery使用者开发必备的工具书,提供详细的Jquery的函数查询及示例

    jQuery.Design.Patterns.178588

    jQuery solves the problems of DOM manipulation, event detection, AJAX calls, element selection and document queries, element attribute and data management, as well as object management utilities....

    jquery ui 插件 效果不错

    [Utilities] Position Widget [About jQuery UI] Getting Started Upgrade Guide Changelog Roadmap Subversion Access UI Developer Guidelines [Theming] Theming jQuery UI jQuery UI CSS Framework ...

    jQuery总结.docx

    jQuery是一个JavaScript函数库。 jQuery是一个轻量级的"写的少,做的多"的JavaScript库。 jQuery库包含以下功能: HTML 元素选取 ... CSS 操作 ... JavaScript 特效和动画 ... Utilities 提供大量的插件

    Jquery-3.6.3.min.js

    Jquery-3.6.3.min.js当前最新版本 jQuery 是一个“写的更少,但做的更多”的轻量级 JavaScript 库。 基本上,您将学习到如何选取 HTML ... jQuery 是一个 JavaScript 函数库。 jQuery 库包含以下特性: ...Utilities

    jquery.validate使用攻略

    Utilities 8 Validator 8 List of built-in Validation methods 9 validate ()的可选项 11 debug:进行调试模式 11 第三章自定义jquery-validate的验证行为 23 第四章自定义错误消息的显示方式 25 第五章一些常用的...

    适合有一定javascript基础的初学者,Jquery教程

    jQuery是一个JavaScript函数库。 jQuery是一个轻量级的"写的少,做的多"的JavaScript库。 jQuery库包含以下功能: HTML 元素选取 HTML 元素操作 CSS 操作 HTML 事件函数 JavaScript 特效和动画 ...Utilities

Global site tag (gtag.js) - Google Analytics