jQuery学习笔记之概述（一）jQuery是一个轻量级的javascript库，jQuery设计的宗旨是 “write

1、概述

jQuery是一个轻量级的javascript库，jQuery设计的宗旨是 “write Less，Do More”，即写的少，做的多。

2、语法

jQuery为javascript query的缩写，即查询js。

jQuery语法即是通过查询DOM元素，并对选取的元素进行操作。

2.1 入口函数

所有的jQuery代码都位于一个document ready函数中：

$(document).ready(function() {
   //jQuery代码
})

这个函数称为jQuery的入口函数，目的是等着页面DOM加载完毕再去执行js。

该函数的简洁写法为：

$(function() {
    //jQuery代码
})

注意： javaScript 入口函数为：

window.onload = function () {
    // js代码
}

jQuery的入口函数和javaScript的入口函数的区别是，

jQuery 的入口函数是指网页中所有标签(DOM)加载完毕，就会执行。可以执行多次。
javaScript的入口函数是必须等网页全部加载完毕（包括外部图片等文件），才会执行。并且只能执行一次，后续执行会覆盖上一次。

2.2 jQuery顶级对象

$是jQuery的别称，在代码中可以用$替代jQuery，为了方便和代码简洁，通常都会使用$
$同时也是jQuery的顶级对象

注意： $是jQuery的标识符，但是随着jQuery的流行,其他js库也会用$作为标识符，这样一起使用会引起冲突。

解决办法:多库共存

把代码里面的$符号统一改为jQuery。例如：jQuery("div");
jQuery变量规定新的名称，让jQuery释放对$控制权：

let suibian = jQuery.noConflict();  //使用suibian作为新的访问符号
console.log(suibian("span"));
suibian.each();

2.3 jQuery对象和DOM对象

DOM 对象：用原生js获取过来的对象就是DOM对象
jQuery对象：用jQuery方式获取过来的对象是jQuery对象。本质：通过$把DOM元素进行了包装（伪数组形式存储）
jQuery对象只能使用 jQuery方法，DOM对象则使用原生的JavaScirpt属性和方法

let myDiv = document.querySelector('div');   //myDiv是DOM对象// 
$('div');               // $('div')是一个jQuery对象
myDiv.style.display = 'none';   // myDiv使用原生js的方法，正确
myDiv.hide();           // 错误！ myDiv是一个DOM对象不能使用 jQuery里面的 hide方法
$('div').style.display = 'none';  // 错误！ 这个$('div')是一个jQuery对象不能使用原生js 的属性和方法

DOM对象和jQuery对象可以相互转换

DOM对象 --> jQuery对象
1. $("HTML标签") 例如：$("div")
2. $(DOM对象) 例如：

let myDiv = document.querySelector('div');
$(myDiv);     //DOM对象myDiv转化为jQuery对象

jQuery对象 --> DOM对象

$("HTML标签")[index]

let myDiv = document.querySelector('div');    // myDiv是DOM对象
$('div');     // 此时为jQuery对象         
myDiv.style.display = 'none';  //DOM对象使用原生js方法
$('div')[0].style.display = 'none';  //jQuery对象转化为DOM对象使用原生js方法

$("HTML标签").get(index)

$('div').get(0).style.display = 'none';  //jQuery对象转化为DOM对象使用原生js方法