Jquery常用工具函数总结

最新推荐文章于 2022-12-23 11:36:53 发布

Jafeney

最新推荐文章于 2022-12-23 11:36:53 发布

阅读量1.5k

点赞数 1

分类专栏： web前端 js 文章标签： jquery 函数对象

本文链接：https://blog.csdn.net/u011413061/article/details/47398471

版权

84 篇文章 0 订阅

订阅专栏

39 篇文章 0 订阅

订阅专栏

对象：

$.type()
- 比 typeof() 更合乎逻辑。
- 比如 typeof(null) 返回 object，而 $.type(null) 返回 null
$.isEmptyObject()
- 检查一个对象是否包含任何属性，包括继承的属性，它与对象的类型无关。
- 有返回false，没有返回true
$.isPlainObject()
- 与isEmptyObject()类似，但它检查的必须是个object实例。因此对于该函数，对空字符串进行检查将返回false
$.extend()
- 合并两个或者两个以上的对象
- 值得注意的功能是将一个或者多个对象的属性合并到一个目标对象中去
- 例如：obj1将会的obj2和obj3的属性
  - var obj1={"1":"property 1"};
  - var obj2={"2":"property 2"};
  - var obj3={"3":"property 3"};
  - $.extend(obj1,obj2,obj3);
  - console.log(obj1["3"]); //显示属性“3”的值
- 关于.extend() 方法，有趣的是可以使用它来克隆javascript 对象（这与$.clone()方法不同）：
  - var clonedObject=$.extend（{}，anObject）;
- $.extend() 方法还可以接受一个布尔值作为一个参数，用于执行对象的深度合并，即递归复制。可以使用该方法来实现对象的深度克隆。
  - var clonedObject=$.extend（true，{}，anObject）;

函数：

jQUery具有两个用于函数的工具方法：.isFunction() 和 .noop()。
- isFunction() 方法用于检查一个对象是否是一个函数。在使用 .isFunction()方法时，请确保去掉函数名的圆括号，在下面的例子中，将 .isFunction() 函数作为参数传入.isFunction()函数自身。由于它是一个函数，因此返回的值必然是 true
  - $.isFunction({}); //false
  - $.isFunction($.isFunction); //true
  - $.isFunction($.isFunction()); //false,由于圆括号
.noop()
- 方法是一个存根函数，它并不执行任何操作。但在某些情况下它是非常有用的，比如，当我们把一个空函数作为参数传递时，以便安装一个在默认情况下不执行任何操作的新事件。

数组操作：

$.isArray()
- 检查对象是否是一个数组
$.makeArray()
- 将一个类似于数组的对象转换为一个真正的数组。将类似与数组的对象转换为数组，将丢失该对象的所有方法和属性。
- 如：
  - //克隆jQUery对象
  - var clonedjq=$.extend(true,{},$);
  - //返回“object”
  - $.type(clonedJjq);
  - //转换为一个JS数组
  - var jqArray=$.makeArray(clonedjq);
  - //返回“array”
  - $.type(jqArray);
$.merge()
- 从第二个数组中获取元素，并将这些元素追加到第一个数组中去，并保留两个数组中元素的愿所有顺序：
$.inArray()
- 用于检查数组中是否存在某个特定的值
- 如果找到将返回它在数组中的索引
- 如果找不到则返回-1
$.unique()
- 用于从DOM元素的数组中移除重读的元素
$.each()执行遍历
- 索引是基于0的，接受两个参数，第一个参数是要遍历的集合，第二个参数一个回调函数。
- 回调函数也可以有两个参数，第一个参数是索引，第二个参数是该元素的值
$.map()数组映射
- 功能类似于$.each()，但它的操作之和数组有关
- 第一个参数是要遍历的数组对象或类似于数组的对象，第二个参数是回调函数
- 该回调函数是对“对每一个元素项进行处理的函数”，第一个参数是当前元素的值，第二个参数是当前元素在数组中的索引。这个参数顺序刚好和 $.each() 相反。

数据结构

$.queue()队列
- 默认的函数队列是fx，它是一个具有标准功能的队列。在fx的上下文中，队列的功能是显而易见的
- 如简单的动画队列：$('#animation').slideUp().fadeIn();
- $.queue队列支持 push和pop操作。要从队列中移除所有函数，可以使用 $.clearQueue()方法。从队列中移除一个函数并执行它可以采用 $.dequeue() 方法。
- 如下面这个例子：首先将第二个动画添加到队列中，然后使用 $.dequeue()方法，从队列栈中弹出一个函数并执行它。

字符串

数据

$.ajax()
- 两种数据交换格式，一是XML，二是JSON
- jQUery可以使用.parseXML()和.parseJSON()方法来解析这两种格式的数据，它既可以解析本地数据，也可以解析URL指定的数据
$.data()
- 可以将任意的数据附加大HTML元素
- 可以存储或者取回数据

其他有用的工具方法

$.contains() 检查子节点
- 两个参数，第一个参数是容器的节点，第二个参数是要检查的目标节点。
- 如：值得注意的是$()返回的是一个类似于数组的对象，因此要引用实际的元素还必须用方括号和索引来获取对元素的引用。
$.isWindow() 区分iframe和浏览器的窗口
$.now() 获取当前的时间
- 它是 (new Date).getTime()方法的一个快捷方式，显然使用 $.now() 非常简洁
$.support() 检查浏览器的特性
- 该方法取代低版本中的 $.browser()
- 一个很好的例子：它可以检查浏览器是否支持Ajax请求（也叫做创建XMLHttpRequest对象）。
$.globalEval() 在全局上下文中求值
- 如下面这个例子：在所有DOM元素加载完之后，创建一个变量x并将它的值初始化为0
- JS原生的eval() 方法执行的上下文是局部的。

关注