jQuery核心函数和工具方法

核心函数

$()和jQuery() 代表调用jQuery的核心函数

能接收的参数如下:

接收一个函数
```
$(function(){console.log(\'函数\')})
```

接受字符串

接收字符串选择器: 返回一个jQuery对象，对象中保存了找到的DOM元素

var $box1 = $(\'.box1\');var $box2 = $(\'#box2\');console.log(\'box1>>>\', $box1);console.log(\'box2>>>\', $box2);

接收代码片段: 返回一个jQuery对象，对象中保存了创建的DOM元素

var $p = $(\"<p>段落</p>\");var $h1 = $(\'<h1>标题一</h1>\')console.log(\'p>>>\', $p);$box1.append($h1);$box1.append($p);

接收一个DOM元素: 会被包装成一个jQuery对象返回给我们

var span = document.getElementsByTagName(\'span\')[0];console.log(\'span>>>\', span)var $span = $(span);console.log(\'$span>>>\', $span)

jQuery对象

jQuery对象是一个伪数组
伪数组的定义：有0到length-1的属性，且有length属性的对象就是伪数组

jQuery静态方法

静态方法和实例方法

静态方法: 直接添加给类的方法

// 定义一个类function oneClass(){}// 静态方法: 直接添加给类的方法oneClass.staticMethod = function(){console.log(\'This is staticMethod\');}// 静态方法通过类名调用oneClass.staticMethod();

实例方法: 添加到类原型上的方法

// 定义一个类function oneClass(){}// 实例方法: 添加到类原型上的方法oneClass.prototype.instanceMethod = function(){console.log(\'This is instanceMethod\');}var a = new oneClass(); // 创建类的实例（对象）// 实例方法通过类的实例（对象）调用a.instanceMethod();

each静态方法

jQuery的each静态方法遍历数组

var arr = [1,2,3,4,5,6]var obj = {0:2, 1:4, 2:6, 3:8, 4:10, length:5}/*- index: 当前遍历到的索引- value: 遍历到的元素*/$.each(arr,function(index, value){console.log(\'arrEach:\', index, value)})$.each(obj, function (index, value) {console.log(\'objEach:\', index, value)})

jQuery的each静态方法能遍历数组，也可以遍历伪数组

原生forEach方法遍历数组

var arr = [1,2,3,4,5,6]var obj = {0:2, 1:4, 2:6, 3:8, 4:10, length:5}/*- index: 当前遍历到的索引- value: 遍历到的元素*/arr.forEach(function(value, index){console.log(\'arrForEach:\', index, value)})// 报错// obj.forEach(function(value, index){//     console.log(\'objForEach:\', index, value)// })

原生的forEach方法只能遍历数组，不能遍历伪数组

map静态方法

jQuery的map静态方法：

var arr = [1, 2, 3, 4, 5, 6]var obj = { 0: 2, 1: 4, 2: 6, 3: 8, 4: 10, length: 5 }$.map(arr,function(value, index){console.log(\'mapArr>>>\', index, value);})$.map(obj, function (value, index) {console.log(\'mapObj>>>\', index, value);})/*第一个参数: 要遍历的数组第二个参数: 每遍历一个元素之后执行的回调函数回调函数参数:value: 当前遍历元素index: 当前遍历到的索引*/

和jQuery中的Each静态方法一样，map静态方法也可以遍历伪数组

each静态方法和map静态方法的区别:
1. map静态方法默认的返回值是一个空数组

处理数组

map静态方法可以在回调函数中通过return对遍历的数组进行处理，然后生成一个新的数组返回

原生js的map方法:

var arr = [1, 2, 3, 4, 5, 6]var obj = { 0: 2, 1: 4, 2: 6, 3: 8, 4: 10, length: 5 }/*value: 当前遍历元素index: 当前遍历到的索引array: 当前被遍历的数组*/arr.map(function(value, index, array) {console.log(\'arr>>>\', index, value, array);})// 报错// obj.map(function (value, index, array) {//     console.log(index, value, array)// })

和原生forEach一样，不能遍历伪数组

holdReady静态方法

作用暂停ready执行

<!DOCTYPE html><html lang=\"en\"><head><meta charset=\"UTF-8\"><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"><title>holdReady</title><script src=\"../jquery-3.5.1.js\"></script><script>/*$.holdReady()作用: 暂停ready执行值为true时暂停，值为false时恢复*/$.holdReady(true);$(function(){alert(\'hello\')})</script></head><body><button>ready事件</button><script>var btn = document.getElementsByTagName(\'button\')[0];btn.onclick = function(){$.holdReady(false);}</script></body></html>

其他函数

$.trim()

: 去除字符串两边的空格

// 返回值: 去除空格之后的字符串var str = \'    ssr    \';console.log(\'----\' + str + \'----\')var newStr = $.trim(str);console.log(\'----\' + newStr + \'----\')

$.isWindow()

: 判断传入对象是不是window对象

// 返回值：true/falsevar res = $.isWindow(win)console.log(\'isWindow>>>\', res)

$.isArray()

: 判断传入对象是不是真数组

// 返回值：true/falsevar resArr = $.isArray(arr)console.log(\'isArray>>>\', resArr)

```
$.isFunction()
```
: 判断传入对象是不是函数

jQuery本质上是一个匿名函数

// 返回值：true/falsevar resFun = $.isFunction(jQuery)console.log(\'isFunction>>>\', resFun)

【jQuery】核心函数和工具方法