javascript类库
就是对js的一些常用的函数和对象进行封装，方便用户使用，且兼容性相当好
document.getElementById()
function g(value){
return document.getElementById(value);
}
常见的js类库：
jquery：轻量级
ExtJs:收费 重量级的
BootStrap:响应式js类库
jquery的导入
通过script标签的src属性导入即可
<script type="text/javascript" src="jquery路径"></script>
jquery对象的获取
通过$(选择器)就可以获取jquery对象
jquery对象和dom对象之间的转换
dom===>jquery
通过$(dom对象)就可以转换成jquery对象
jquery===>dom
jquery可以看成是一个数组
方式1：
通过jquery对象.get(索引)
方式2：
通过jquery对象[索引]
选择器：
基本选择器：
id选择器
$("#id值")
class选择器
$(".class值")
元素选择器
$("标签名")
全部选择器
$("*")
选择多个，多个选择器用","分隔
$("#id值,.calss值")
基层选择器：
子孙关系
a b $("a b"):所有的后代
父子关系
a>b $("a>b"):a下的所有b孩子
下一个兄弟
a+b $("a+b"):a后面的第一个兄弟
后面所有兄弟
a~b $("a~b"):a后面的小弟
基本过滤选择器：
☆
:first
:last
:not(selector)
:even 索引为偶数的
:odd 索引为奇数的
:eq(index) 等于
:gt(index) 大于
:lt(index) 小于
(了解)
:header 标题 针对h标签
:animated 执行动画
:focus 获取焦点
内容过滤选择器：☆
:contains(text) 包含指定内容
例如：选取含有文本“di”的div元素
$("div:contains(‘di‘)")
:empty 没有子节点的元素 节点：元素节点 属性节点 文本节点 文档节点document
例如：选取不包含子元素(或者文本元素)的div空元素
$("div:empty")
:has(selector) 含有指定节点
例如：选取含有class为mini元素 的div元素
$("div:has(.mini)")
:parent 有子节点的元素
例如：选取含有子元素(或者文本元素)的div元素
$("div:parent")
可见性过滤选择器：☆
:hidden 不可见的元素(主要指 display:none input type="hidden")
:visible
扩展：遍历
方式1：对象的each方法 对象.each(fn)
方式2:jquery的each方法 $.each(数组,fn)
属性选择器：
[attribute]☆ 含有指定属性
[attribute=value]☆ 含有指定属性并且值固定
(了解)
[attribute!=value] 指定属性不为指定值(包含没有此属性)
[attribute^=value] 属性值以指定内容开头
[attribute$=value] 属性值以指定内容结尾
[attribute*=value] 属性值含有指定内容
[attrSel1][attrSel2][attrSelN] 复合属性选择器，需要同时满足多个条件才能使用
子元素过滤选择器：
:nth-child(序号) 第几个孩子
例如：选取每个class为one的div父元素下的第2个子元素
$("div.one>:nth-child(2)")
:first-child 第一个孩子
例如：选取每个class为one的div父元素下的第一个子元素
$("div.one>:first-child")
:last-child 最后一个孩子
例如：选取每个class为one的div父元素下的最后一个子元素
$("div.one>:last-child")
:only-child 独生子
例如：如果class为one的div父元素下的仅仅只有一个子元素，那么选中这个子元素
$("div.one>:only-child")
表单过滤选择器(了解)
:input 表单子元素 input select textarea button(等价于 <input type="button"/>)
:text 文本框
:password 密码框
:radio 单选框
:checkbox
:submit
:image
:reset
:butoon <button>和<input type="button" />
:file
:hidden display="none"和type="hidden"
表单对象过滤选择器：☆
:enabled
:disabled
:checked 单选框和多选框
:selected 下来选
属性和样式
属性
attr():设置或者获取指定的属性
格式1:
attr(key):获取指定属性
格式2:
attr(key,value):设置属性
格式3:
attr(json):设置多个属性
json的格式:{key1:value1,key2:value2}
removeAttr(key):移除指定的属性
class的操作
addClass(class的名称):添加class
removeClass(class的名称):移除class
toggleClass(class的名称):切换class 若有指定的class则移除，否则添加
HTML代码/文本/值
共同点：
xxx():获取
xxx(""):设置
html():设置或获取标签体的内容
text():设置或获取标签体的内容
val():设置或获取value属性
html()和text()区别：
设置值: html会把字符串解析，text作为普通文本
获取值: html会把标签解析，text只获取文本内容
css的操作：
css():设置或获取指定css
格式1:相当于操作标签style属性 <xxx style="css"></xxx>
css(key):获取指定样式的值
格式2:
css(key,value)
格式3:
css(json):设置多个样式
offset():获取元素的位置
height():
width():
文档处理
☆
内部插入:(掌握任意一种)
append() : a.append(c) 将c内部插入到a的末尾
prepend(): a.prepend(c)将c内部插入到a的前面
appendTo(): a.appendTo(c)将a内部插入到c的末尾
prependTo():a.prependTo(c)将a内部插入到c的前面
外部插入:(掌握任意一种)
after(): a.after(c) 在a的后面插入c
before(): a.before(c)在a的前面插入c
insertAfter(): a.insertAfter(c)将a插入到c的后面
insertBefore():a.insertBefore(c)将c插入到c的前面
删除:
empty():清空元素
remove():删除元素 在内存中彻底删除，在元素上绑定的事件和附加的数据都会被移除
detach():删除元素 在内存中不删除，在元素上绑定的事件和附加的数据都不会被移除
克隆
clone([boolean]):克隆
参数若为true,代表把相应的事件一并克隆
(了解)
替换：
replaceWith() :a.replaceWith(c) 用c替换a
replaceAll() :a.replaceAll(c) 用a替换所有的c
包裹:
wrap() a.wrap(html) 用html包裹每一个a
wrapAll() a.wrapAll(html) 用html包裹所有的a
wrapInner() a.wrapInner(html) 用html包裹a下的所有孩子
unwrap() a.unwrap() 脱去衣服
//注意：
window.onload=function(){}
等价于
$(document).ready(function(){
});
$(function(){})
//事件
原生js:document.getElementById("btn1").onclick=function(){}
jquery写法：$("#btn1").click(function(){})
