1、jQuery 概述和基本使用

最新推荐文章于 2022-09-21 21:26:27 发布

是瑞瑞小甜心

最新推荐文章于 2022-09-21 21:26:27 发布

阅读量186

点赞数

分类专栏： jQuery 文章标签： jquery

本文链接：https://blog.csdn.net/weixin_45998542/article/details/120465118

版权

17 篇文章 0 订阅

订阅专栏

jQuery 是一个 JavaScript 库。j 就是 JavaScript； Query 查询；意思就是查询js，把js中的DOM操作做了封装，我们可以快速的查询使用里面的功能。学习jQuery本质就是学习调用这些函数（方法）。

官网地址： jQuery

各个版本的下载：jQuery CDN

（1）引入 jQuery 文件（2）直接使用

$(function () {  
... // 此处是页面 DOM 加载完成的入口 
}) ;

jQuery 的入口函数等 DOM 结构渲染完毕即可执行内部代码，不必等到所有外部资源加载完成，相当于原生 js 中DOMContentLoaded。

(1)$ 是 jQuery 的别称，在代码中可以使用 jQuery 代替 $。

(2)$ 是jQuery 的顶级对象，相当于原生JavaScript中的 window。把元素利用$包装成jQuery对象，就可以调用 jQuery 的方法。

(1)DOM 对象：用原生js获取过来的对象，使用原生的 JavaScirpt 属性和方法

var myDiv = document.querySelector('div'); 
// myDiv 是DOM对象
var mySpan = document.querySelector('span'); 
// mySpan 是DOM对象

(2)jQuery对象：用jquery方式获取过来的对象，jQuery对象只能使用jQuery方法

$('div'); // $('div')是jQuery对象
$('span'); // $('span')是jQuery对象

(3)DOM 对象与 jQuery 对象之间的相互转换

（原生js 比 jQuery 更大，一些属性和方法 jQuery并没有给我们封装. 要想使用这些属性和方法需要把 jQuery对象转换为DOM对象才能使用）

DOM 对象转换为 jQuery 对象： $(DOM对象)

$('div') //直接获取，得到就是jQuery对象

jQuery 对象转换为 DOM 对象（两种方式）

jQuery 对象以伪数组形式存储

$('div') [index] // index 是索引号
$('div') .get(index) // index 是索引号

遍历内部 DOM 元素（伪数组形式存储）的过程就叫做隐式迭代。

// 隐式迭代就是把匹配的所有元素内部进行遍历循环，给每一个元素添加css这个方法
  $("ul li").css("color", "red");

实现链式编程的核心：在方法中，js提供一个this的关键字，表示当前对象，

对象中的每一个方法都会返回当前对象，简化代码量

$(this).css('color', 'red').sibling().css('color', '');

关注