我们学会了用各式各样的方法去选择元素,然后对它们进行操作。而选择的结果不外乎以下三种:
- 没有元素被选中
- 有唯一的元素被选中
- 有多个元素被选中
这样看起来情况很复杂,但事实上,每一次我们选择之后返回的都是一个被选中元素的合集。这是一个对象,我是说它的数据类型是一个对象,不过这个对象有很多用法和表现上非常类似于一个数组,我说的是类似,所以在本质上它并不是,好多地方也并不一样。
如果没有元素被选中,那么这可以看作是一个空数组,我们可以用如下方法进行判断:
$('miao').length === 0 // 返回 true
上面的选择器是说标签为 miao
的元素,显然这个元素是不存在的,所以最终合集中没有元素,于是它的长度为 0。
因为这个合集类似于数组,我们甚至可以有这样的操作 $('a')[0]
。就是完全像数组一样,用序号取出其中的某个元素。这很容易理解,不管它究竟是什么数据类型,反正我们可以像数组一样进行操作,这就够了。
但是,我们要明确一下数组内容是什么。这个合集所包含的确实是所有匹配到的元素,但注意哦,是匹配的元素。而我们前面学习的那些 jQuery 方法所操作的,是经过 jQuery 包装的对象。
它们的区别是什么呢?jQuery 提供了一系列对元素进行操作的方法,但是我们通过书写的格式也可以看出,这些方法其实是一个对象下面的属性,这个对象是谁?并不是某一个元素,而是 jQuery。是 $()
这个对象下面的方法。这有些超出了我们所学的范围,所以我们慢慢来理解。jQuery 提供了一个对象,它的名字叫作 $
[1]。然后这个对象具有很多的属性,这些属性中有一部分其实是函数,就是可以用来执行实现某些功能的。而我们写在小括号里的,都是参数。 $()
这个小括号里面,用来描述我们想要操作的元素,表示我们希望对哪些元素来执行后面的方法。而实际上,是我们告诉 jQuery 想要对“谁”做“什么”,然后它去完成这些操作。这就是一个助理,一个工具,甚至说是一个操作界面,我们做了输入,它进行相应的输出,或者说是相应的操作,而中间的过程无须我们关注。在我们看来仿佛这个输入和输出是连贯的,但实际上我们要知道这中间省略了一些过程,我们没有看到而已。
这上面我们说了,这个合集,包含的是元素。我们可以像上面那样,去将其中每一个元素选取出来,但这是没有经过 jQuery 包装的,原生的元素。我们还可以使用 jQuery 的方法对它进行操作么?自然是不行的。
这东西没理解的时候觉得很绕,一旦理解了,发现原来挺简单的。我举一个不是很贴切的例子吧。大家都吃过冰激淋吧,冰淇淋本身是不方便去拿的,那东西冰冰凉凉黏黏呼呼,一摸还融化,虽然很好吃(口水……)。所以我们都是在外面再加一个容器,很常见的,套着一个甜筒(蛋卷)。这就是一种包装,我们对冰淇淋做的许多操作其实都是通过甜筒去作用的。比如我们说拿起冰淇淋,其实是抓住了那个甜筒,并没有真的摸着冰淇淋,但是从效果上,我们可以带着冰淇淋去大街上边走边吃了。
jQuery 就相当于这样一个包装,让我们更方便去操作网页中的元素。而实际上我们的操作是作用在了这个包装上,然后透过包装影响到了这些元素。
但是当我们谈论这个冰淇淋的量的时候,一个球两个球……甚至10个球,这都是在说里面的冰淇淋本身,并没有包含外面这个包装。这个红色的冰淇淋球很好看,能不能分给我吃?可是我怎么拿走呢……对,我们说这个冰激凌的 10 个球,算是一个合集,它们没有包装,虽然我们在谈论的时候经常不会注意这一点,但是当我们伸手想要拿起其中一个球的时候,就会发现这有点不好操作,还是给我一个甜筒比较方便。
暂无评论内容