1. jQuery的$符号（重点）
jquery对象是一个数组。数组中包含着原生JS中的DOM对象。可以通过从数组中取值的方式获得所需要的dom对象
js命名规范允许出现的字符有：数字、字母、下划线、$。
Js命名规范允许作为变量命名开头的字符有：字母、下划线、$；但是，不允许以数字作为变量命名的开头。
var $ = “我是字符串”;
var $ = 123;
function $(){
alert(“我是函数$”);
}
jQuery使用$符号原因：书写简洁、相对于其他字符与众不同、容易被记住。
怎么理解jQuery里面的$符号：
$实际上表示的是一个函数。
$(); // 调用上面我们自定义的函数$
$(document）.ready(function(){});// 调用入口函数
$(function(){}); // 调用入口函数
$(“#btnShow”) // 获取id属性为btnShow的元素
$(“div”) // 获取所有的div元素
jQuery里面的$函数，根据传入参数的不同，进行不同的调用，实现不同的功能。返回的是jQuery对象
jQuery这个js库，除了$之外，还提供了另外一个函数：jQuery
jQuery函数跟$函数的关系：jQuery === $;
2. jQuery对象和DOM对象的相互转换（难点）
//1.js对象转换成jquery对象。 $(js对象);
//2.jquery对象转换成js对象。 1.jquery对象[索引值] 2. jquery对象.get(索引值)
DOM对象此处指的是：使用js操作DOM返回的结果。
var btn = document.getElementById(“btnShow”); //btn就是一个DOM对象
jQuery对象此处指的是：使用jQuery提供的操作DOM的方法返回的结果。
jQuery拿到DOM对象后又对其做了封装，让其具有了jQuery方法的jQuery对象，说白了，就是把DOM对象重新包装了一下。
（联想：手机和有手机壳的手机，手机就好比是DOM对象，有手机壳的手机就好比是jQuery对象）
var btn = $(“#btnShow”); // $btn就是一个jQuery对象
DOM对象转换成jQuery对象：
var $btn1 = $(btn); // 此时就把DOM对象btn转换成了jQuery对象$btn1
// $(document）.ready(function(){});// 调用入口函数
// 此处是将document这个js的DOM对象，转换成了jQuery对象，然后才能调用jQuery提供的方法：ready()
jQuery对象转换成DOM对象：jq对象[index]
// 第一种方式
var btn1 = $btn1[0]; // 此时就把jQuery对象$btn1转换成了DOM对象btn1 （推荐使用此方式）
// 第二种方式jquery对象.get(索引值)
var btn2 = $btn.get(0);// 此时就把jQuery对象$btn转换成了DOM对象btn2
这两种方式都要记住，使用哪一种都可以。
3.jq操作节点
3.1 添加节点append()、appendTo()
append()（重点）
作用：在被选元素内部的最后一个子元素（或内容）后面插入内容（存在或者直接创建出来的html元素都可以）
如果是页面中存在的元素，那么调用append()后，会把这个元素放到相应的目标元素里面去；但是，原来的这个元素，就不存在了。
如果是给多个目标追加元素，那么方法的内部会复制多份这个元素，然后追加到多个目标里面去。
常用参数：htmlString 或者 jQuery对象
appendTo()
作用：同append()，区别是：把$(selector)追加到node中去
prepend()
作用：在元素的第一个子元素前面追加内容或节点 $(selector).prepend(node);
after()
作用：在被选元素之后，作为兄弟元素插入内容或节点 $(selector).after(node);
before()
作用：在被选元素之前，作为兄弟元素插入内容或节点 $(selector).before(node);
<body>
<button>添加节点</button>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
</body>
<script src="jquery-3.3.1.js"></script>
<script>
$('button').click(function() {
//append()某个元素后面追加内容
// $('ul').append('<li>5</li>');
//appendTo()将前面的内容追加到某个元素后面
$('<li>5</li>').appendTo('ul');
});
</script>
3.2 删除节点：remove()
empty()
<body>
<button>删除方式一</button>
<button onclick="del()">删除方式二</button>
<button onclick="del3()">删除方式三（删除属性）</button>
<p>默认选中<input type="checkbox" checked></p>
<ul>
<li>muzidigbig</li>
<li>muzidigbig</li>
<li>muzidigbig</li>
<li>muzidigbig</li>
<li>muzidigbig</li>
</ul>
</body>
<script src="jquery-3.3.1.js"></script>
<script>
$('button:first-child').click(function () {
$('ul').remove();
});
function del() {
$('ul').empty();
}
function del3() {
$('input').removeAttr('checked');
}
</script>
补充：
// 清空指定元素的所有子元素（光杆司令）
// 没有参数
$(selector).empty();
$(selector).html(“”);
// “自杀” 把自己（包括所有内部元素）从文档中删除掉
$(selector).remove();
和 .empty()相似。.remove() 将元素移出DOM。 当我们想将元素自身移除时我们用 .remove()，同时也会移除元素内部的一切，包括绑定的事件及与该元素相关的jQuery数据。要删除的元素不删除数据和事件的情况下，使用.detach()来代替。
作用：复制匹配的元素
// 复制$(selector)所匹配到的元素
// 返回值为复制的新元素
$(selector).clone();
总结：
推荐使用html(“<span></span>”)方法来创建元素或者html(“”)清空元素
3.3 节点包裹wrap()、wrapAll()
<body>
<button onclick="bao()">节点包裹</button>
<button onclick="baoAll()">节点包裹</button>
<input type="text">
<input type="text">
</body>
<script src="jquery-3.3.1.js"></script>
<script>
function bao(){
//将每个input标签用p包裹
$('input[type]').wrap('<p></p>')
}
function baoAll() {
//将所有的input标签用p包裹
$('input[type]').wrapAll('<p></p>')
}
</script>
若有不足请多多指教！希望给您带来帮助！