jQuery的总结

郭浪 Lv3

jQuery是一个 JavaScript 库,里面封装了很多函数方法我们可以通过调用函数中的方法来快速实现一些js中常用的方法(我们调用的时候要通过jQuery导出的一个$作为前置符号类引用),极大简化了 JavaScript 编程。

jQuery中的顶级对象$

  1. $是 jQuery 的别称,在代码中可以使用 jQuery 代替,但一般为了方便,通常都直接使用 $ 。
  2. $是jQuery的顶级对象,相当于原生JavaScript中的 window。把元素利用$包装成jQuery对象,就可以调用jQuery 的方法。

jQuery 对象和 DOM 对象

使用 jQuery 获取到的元素和使用原生js方法获取到的元素是不一样的,我们使用 jQuery 获取到的对象是利用$对 DOM 对象包装过后产生的对象(一般以伪数组的形式存储) 这里要注意的是只有 jQuery 对象才能使用 jQuery 方法,DOM 对象则使用原生的 JavaScirpt 方法。

jQuery 对象和 DOM 对象转换

DOM 对象与 jQuery 对象之间是可以相互转换的。因为原生js 比 jQuery 更大,原生的一些属性和方法 jQuery没有给我们封装. 要想使用这些属性和方法需要把jQuery对象转换为DOM对象才能使用。

1
2
3
4
5
6
7
8
9
10
// 1.DOM对象转换成jQuery对象,方法只有一种
var box = document.getElementById('box'); // 获取DOM对象
var jQueryObject = $(box); // 把DOM对象转换为 jQuery 对象

// 2.jQuery 对象转换为 DOM 对象有两种方法:
// 2.1 jQuery对象[索引值]
var domObject1 = $('div')[0]

// 2.2 jQuery对象.get(索引值)
var domObject2 = $('div').get(0)

jQuery 选择器

1
2
3
4
$("选择器")   //  里面选择器直接写 CSS 选择器即可,但是要加引号 
比如说我们使用ID选择器的时候就直接 $("#id") 就可以直接查找到指定ID的dom
并集选择器一般使用 $("div,p,li") 使用逗号隔开
交集选择器 $("li.active") 使用的是句号隔开

筛选选择器

1
2
和原生js中的 net 有点像 $("li:first") 选中第一个
关键词还有 :last(最后一个) :eq(index)这里面填写的为数组中具体DOM对应的一个下标从0开始 :odd(选择到元素中索引号为奇数的元素) :even(选择到元素中索引为偶数的元素)

jQuery常用的几种方法

  1. text();获取和设置文本节点
  2. css();获取和设置样式
  3. val();获取和设置value属性
  • 标题: jQuery的总结
  • 作者: 郭浪
  • 创建于 : 2024-11-09 14:22:36
  • 更新于 : 2024-11-09 14:22:36
  • 链接: https://guolang.top/2024/11/09/jQuery的总结/
  • 版权声明: 本文章采用 CC BY-NC-SA 4.0 进行许可。
目录
jQuery的总结