--------------------------------基本选择器：
id .
标签 标签名
类 #
交集， 没有符号
并集, 逗号隔开
通配符 *
--------------------------------层次选择器：
后代符号为 空格
子选择器 >
相邻 +
同辈 波浪号
--------------------------------属性选择器：
[ ]
--------------------------------过滤器选择器：
:last 最后
:first 第一
:odd 偶数
:even 奇数
:eq 等于
:gt 大于
:lt 小于
:not() 从匹配集合元素中删除元素
:foucus 获取焦点的元素
:header 选取所有标题元素
:visible 选取当前所有可见元素
:hidden 选取当前所有隐藏元素
---------------------------------------------------------| 事件 |-------------------------------
---------------------------------------鼠标事件
click( ) 点击事件：当鼠标点击时触发
mouseover( ) 悬停事件：当鼠标悬停在元素上时触发
mouseout( ) 鼠标离开事件：当鼠标离开悬停的元素时触发
---------------------------------------键盘事件
keydown( ) 当按键按下时触发
keyup( ) 当按键弹起时触发
keypress( ) 当按键在按压状态时触发
--------------------------------------复合事件
hover( ) 鼠标悬停和离开时：悬停时会触发mouseover( )
toggle( ) 当指定元素被点击时，在两个或多个函数之间轮流切换在 显示和隐藏之间进行切换。
--------------------------------------表单事件
foucus( ) 当元素获得焦点时，发生 focus 事件
blur( ) 当输入域失去焦点 (blur) 时改变其颜色
change( ) 当元素的值发生改变时，会发生 change 事件。
--------------------------------------------------| 动画 |----------------------------------------------
$("img").show(2000)
$("img").hide(2000)
$("img").fadeIn(2000)
$("img").fadeOut(2000)
$("img").slideDown(2000);
$("img").slideUp(2000)
原生js可以和jq可以同时存在
同时存在是需要注意，jq函数只能被jq节点使用
jq节点指 通过jq选择器获取到的节点
-------$(select): select 选择
dom如果想要使用jq函数的话，需要将js节点转换成jq节点。
-------$(element): 把js节点转换成jq节点
element（元素）表示的是节点对象
点一次button添加一条li
原理：
先获取原本的数据，在原本的数据上添加
新建一个节点：
原生js var li = "<li>22222</li>"
获取原本数据
var newli = $("#ul").html()+li
插入
$("#ul").html(newli)
------------------------------------ 》》》Dom操作实现《《《------------------------------
------------------------------------------在元素内部追加子节点------------------------------
$(a).append(b) 把b添加到a中
append 追加，在元素内部追加新的节点
//append是jq函数，参数严格意义老说也是一个jq节点
------新建一个节点
var li = $("<li>22222</li>") //把html标签转换成jq节点
------插入
$("#ul").append(li)
可以传入多个参数
------append（b） //把b添加到a中 在a之后追加
------appendTo(b) //把a添加到b中 在b之后追加
------prepend（b） //把b添加到a中 在b之前追加
------prependTo（b） //把a添加到b中 在a之前追加
-----------------------------------------在同辈元素外部添加----------------------------------
after(content) //$(A).after(B) 表示 将B插入到A之后。
insertAfter(content) //$(A).insertAfter(B) 表示将A插入到B之后
before(content) //$(A).before(B) 表示将将B插入A之前
insertBefore(content) //$(A).insertBefore(B) 表示将A插入B之前
----------------------------------------------| 替换节点 |--------------------------
replaceWith( ) 和 replaceAll( ) 用于替换某个节点 (node)节点 replace替换
$("ul li:eq(2)").replaceWith($("newnode"))
$("newnode").replaceAll$("ul li:eq(2)")
//两个函数效果一样，但是前后对象顺序不同
----------------------------------------------| 复制节点 |---------------------------------
clone()用于赋值某个节点 参数true 表示复制除了复制节点意外还复制事件
对于要新建一个复杂的节点可以先复制一个存在的节点 在他的基础上修改
$("ul li:eq(1)").clone(ture).appendTo("ul")//复制一个元素并添加到~~~
-----------------------------------------| 获取元素属性 |----------------------------------
attr（） 获取 与 设置元素属性
attr只有一个参数的时候可以根据属性名来获取值
$("#img").attr("style")
两个参数表示表示选择一个属性，并修改值
$("#img").attr("src","~~~")
同时设置多个属性（1）
·$("#img").attr("src","~~~")
·$("#img").attr("src","~~~")
·$("#img").attr("src","~~~")
同时设置多个属性（2） 组装一个js对象，（大括号括起来的多个键值对）
￥（"#img"）.attr({
width:"300",
hight:"200"
})
json字符串和js对象的区别
removeAttr（） 用来删除元素数据
-------------------------------------------| 删除节点 |---------------------------------------
//移除节点 事件没了
remove（）：删除整个节点
直接把节点在整个文档中移除
//移除节点，附加的 事件还在
detach（）：删除整个节点
//清空节点
empty（）：清空 与$("#div").html("")效果类似
清空节点中的内容
empty清空节点 不移除节点
remove datech 都是删除节点 移除之后可以找回，
remove找回节点的时候只能找回标签 和标签内容，事件丢失
datech找回节点的时候连事件也可以找回。
------------------------------------------------| 遍历元素 |---------------------------------------
children() 获取所有子元素，方法可以有参数 参数为过滤
$("body").children()获取<body>的子元素，但是不包含子元素的元素
find() 获取被选取元素所有的后代元素
-----------------------------| 遍历同辈元素 []这里表示的是可选 可以填参数也可以不填
--next（[expr]） 获取紧邻匹配元素之后的元素
nextAll
nextUntil(4)
--prev([expr]) 用于获取紧邻匹配元素之前的元素
prevAll()
prevUntil
--slibings([expr]) 用于获取匹配元素前面和后面的所有的同辈元素
-----------------------------| 遍历前辈元素
parent() 获取父辈元素
parents() 获取祖辈元素
parentUntil(4)
table标签在被浏览器解析的时候，浏览器会在table
和tbody标签 表示表格主体，没有实际意义
但是代码中有用到层级关系时需要注意下
-------------------------样式操作、
css（）、addClass()、removeClass()、toggleClass()
$("<option> </option>") .text .val
