核心函数
$();//jQuery原理();就代表调用jQuery的核心函数
1.接收一个函数
$(function(){
alert("hi")
});
2.1接收一个字符串选择器 返回一个jQuery对象, 对象中保存了找到的DOM元素
$(function () {
var $p = $("<p>我是段落</p>");
console.log($p);
});
2.2接收一个代码片段 返回一个jQuery对象, 对象中保存了创建的DOM元素
$(function () {
var $box1 = $(".box1");
var $box2 = $("#box2");
console.log($box1);
console.log($box2);
});
3.接收一个DOM元素 会被包装成一个jQuery对象返回给我们
$(function () {
var span = document.getElementsByTagName("span")[0];
console.log(span);
var $span = $(span);
console.log($span);
});
jQuery对象
jQuery对象是一个伪数组
(伪数组 有0到length-1的属性,并且有length属性)
静态方法 实例方法
// 1.定义一个类
function AClass() {
}
// 2.给这个类添加一个静态方法
// 直接添加给类的就是静态方法
AClass.staticMethod = function () {
alert("staticMethod");
}
// 静态方法通过类名调用
AClass.staticMethod();
// 3.给这个类添加一个实例方法
AClass.prototype.instanceMethod = function () {
alert("instanceMethod");
}
// 实例方法通过类的实例调用
// 创建一个实例(创建一个对象)
var a = new AClass();
// 通过实例调用实例方法
a.instanceMethod();
静态方法
静态方法each方法
原生js
var arr = [1, 3, 5, 7, 9];
var obj = {0:1, 1:3, 2:5, 3:7, 4:9, length:5};
arr.forEach(function (value, index) {
console.log(index, value);
});
obj.forEach(function (value, index) {
console.log(index, value);
}); //报错
value 第一个参数: 遍历到的元素
index 第二个参数: 当前遍历到的索引
注意点:
原生的forEach方法只能遍历数组, 不能遍历伪数组
利用jQuery的each静态方法遍历数组
var arr = [1, 3, 5, 7, 9];
var obj = { 0: 1, 1: 3, 2: 5, 3: 7, 4: 9, length: 5 };
$.each(arr, function (index, value) {
console.log(index, value);
});
$.each(obj, function(index, value) {
console.log(index, value);
});
value 第一个参数: 当前遍历到的索引
index 第二个参数: 遍历到的元素
注意点:
jQuery的each方法是可以遍历伪数组的
静态方法map方法
原生js
var arr = [1, 3, 5, 7, 9];
var obj = { 0: 1, 1: 3, 2: 5, 3: 7, 4: 9, length: 5 };
arr.map(function (value, index, array) {
console.log(index, value, array);
});
obj.map(function (value, index, array) {
console.log(index, value, array);
});
value 第一个参数: 当前遍历到的元素
index 第二个参数: 当前遍历到的索引
array 第三个参数: 当前被遍历的数组
注意点:
和原生的forEach一样,不能遍历的伪数组
map
$.map(arr, function (value, index) {
console.log(index, value);
});
value 第一个参数: 要遍历的数组
index 第二个参数: 每遍历一个元素之后执行的回调函数
回调函数的参数:
value 第一个参数: 遍历到的元素
index 第二个参数: 遍历到的索引
注意点:
和jQuery中的each静态方法一样, map静态方法也可以遍历伪数组
jQuery中的each静态方法和map静态方法的区别:
each静态方法默认的返回值就是, 遍历谁就返回谁
map静态方法默认的返回值是一个空数组
each静态方法不支持在回调函数中对遍历的数组进行处理
map静态方法可以在回调函数中通过return对遍历的数组进行处理, 然后生成一个新的数组返回
