工具方法、CSS属性及方法
1、JS与JQuery转换
1）概述
- $类似java中的类
- $()类似java中的类的构造方法
2）JS与jQuery转换
js转换jQuery：
$(js对象) //作用：转换作用
jQuery转换js
1.可以通过下标转换成js对象
var a= $("#a");
console.log(a[0].innerHTML)
console.log(a.innerHTML);
2.可以通过get方法+下标获取
console.log($oDiv.get(0).innerHTML);
2、$工具方法
JQuery有许多的$怎么用的方法，要更多方法怎么用的可以参考JQuery官方API文档
我就列举一下
1.$.each()：遍历数组、对象、对象数组中的数据
2.$.trim()：去除字符串两边的空格
3.$.type(obj)：得到数据的类型
4.$.isArray(obj)：判断是否是数组
5.$.isFunction(obj)：判断是否是函数
6.$.parseJSON(obj)：解析json字符串转换为js对象/数组
3、JQuery属性和css
属性
attr()：//获取某个标签属性的值，或设置某个标签属性的值
removeAttr()：//删除某个标签属性
addClass()：//给某个标签添加class属性值
removeClass(): //删除某个标签class属性值
prop(): 和 attr()类似，//区别在于prop用于属性值为Boolean类型的情况，比如多选
html(): //获取某一个标签体内容（注意：该标签体中可以包含子标签）
text()：//获取某一个标签体内容(注意：该标签体不能包含子标签)
val()：//主要用户获取/设置输入框的值
更多属性查看API文档
CSS
- css()：设置标签的css样式
```js
css("样式名");//获取样式值：
css("样式名","样式值");//设置单个样式：
css({"样式名"："样式值"，"样式名"："样式值"});//设置多个样式：
2. 位置
```js
offset()：//相对整个大容器的相对位置
position()：//相对父容器的相对位置
- 尺寸
width(): //容器宽
height(): //容器高
innerWidth()：//width+padding
innerHeight()：//height+padding
outerWidth(): //width+padding+border
outerHeight(): //height+padding+border
筛选、文档处理
1、筛选
过滤
first()：获取匹配的第一个元素
last()：获得匹配的最后一个元素
eq(N)：获取匹配的第N或-N个元素
filter(selector)：筛选出与指定表达式匹配的元素集合
has(selector)：筛选出包含特定特点的元素的集合
not(selector)：筛选出不包含特定特点的元素的集合
在jQuery对象数组中，过滤出一部分元素来
查找
children()：子标签中找
find()：后代标签中找
parent()：父标签
prevAll()：前面所有的兄弟标签
nextAll()：后面所有的兄弟标签
siblings()：前后所有的兄弟标签
在jQuery对象数组中，根据选择器查找孩子、父母、兄弟标签
2、文档处理
增
内部插入
append()：将内容添加到指定的元素后面
appendTo()：和append()颠倒
//后面
prepend()：将内容添加到指定元素前面
prependTo():和prepend()颠倒
//前面
外部插入
after()：在匹配元素之后插入内容
before()：在匹配元素之前插入内容
删
empty()：删除匹配的元素集合中所有的子节点（不包含匹配的元素）
remove()：删除匹配的元素集合中所有的子节点（包含匹配的元素）
改
replaceWith()：将所有匹配的元素替换成指定的内容
事件、动画
事件
1、加载DOM的两种方式
- window.onload方式：所有页面内容加载完后才执行。只能编辑一个。
- JQuery方式：页面结构绘制完成后执行。可以编辑多个。
2、绑定事件的两种方式
1. 元素.on("时间名",function(){
});
2. 元素.时间名(function(){
});
3、合成事件、事件切换
hover() //鼠标悬停事件--移入移出
toggle() //鼠标点击合成事件
4、事件冒泡事件
传播：小》中》大
阻止传播：事件后面加 return false
5、事件坐标
offsetX(); //当前元素左上角
client(); //窗口左上角
pageX(); //网页左上角
6、移除事件
元素.unbind("时间名");
动画效果
基本
显示：show(time);
不显示：hide(time);
切换：toggle(time);
滑动
slideUp(time);//动画收缩--向上
slideDown(time);//动画张开--向下
slidetoggle(time);//动画切换
淡入淡出（透明度）
fadeIn(time);//淡入（透明度）
fadeOut(time);//淡出（透明度）
fadeToggle(time);//切换
自定义动画
元素.animate({
属性：属性值},time);
缩放：width height
移动：top left
移动本元素，距离：top="+=" left="-="
