jQuery部分

					**jQuery易混部分**

1.查找方法：
获得所有子元素： $(’#id’).children();
获得第一个子元素： $(’#id li:first-child’)
获得最后一个子元素： $(’#id li:last-child’)
获得指定索引的元素： $(’#id li:nth-child(1)’) 这里的索引是从1开始的

获取下一个兄弟元素 $(’#id’).next()
获取下面所有兄弟元素 $(’#id’).nextAll()

获取上一个兄弟元素 $(’#id’).prev()
获取上面所有兄弟元素 $(’#id’).prevAll()

获取父级元素 $(’#id’).parent()
获得先辈元素 $(’#id’).parents(’.class’)

获得所有的同辈元素 $(’#id’).siblings()

在指定元素中的查找后代元素 $(‘ul’).find(’.class’)

在同级中通过下标查找元素(同级) $(li).eq(2);

2.CSS添加样式
单条添加CSS .css(‘样式’,’值’);
批量添加CSS .css({‘样式1’:’值1’,’样式2’:’值2’})

3. class类操作
   添加类 .addClass(类名)
   删除类 .removeClass(‘类名’)
   切换类 .toggleClass(‘类名’)

4.属性操作
增加属性 .attr(‘属性名’,’属性值’)
查看属性 .attr(‘属性名’)
删除属性 .removeattr(‘属性名’)

Ps:属性操作也可以加入类与其它属性,  类操作只能加类

添加标准属性  prop(‘属性名’,’属性值’)	删除标准属性  removeProp(‘属性名’)
重点: attr与prop 的区别?
	attr()方法可以添加任意的属性名与值,而prop方法只能添加标准属	性.但prop可以准确的获取到单多选是否选中的值.

5. Jq中的遍历方式 each

    格式1. 
    	$.each(jq集合, function(k,v){
    	第一个参数接收键
    	第二个参数接收值
    })
   
    格式2
    $.jq对象集合(function(k,v){
    	第一个参数接收键
    	第二个参数接收值
    })
   

   Ps:第二种格式只试用于遍历jq对象集合

6.节点操作
内部后追加（在末尾出加入）append
内部前追加 (在最前面加入) prepend

7.克隆 clone
真克隆 .clone(ture)
假克隆 .clone(false)默认
jQuery中的区别：真克隆会克隆事件 假克隆不会

8.删除
empty() 清空 彻底清空
remove() 强删除元素,同时清空事件,可以返回被删除的元素
detach() 软删除元素,不清空事件,可以返回被删除的元素

remove（）与detach（）删除的区别：
remove（）与detach（）都是删除，都可以返回被删除的元素，但是remove（）会清空事件，而detach（）会保留事件。

9.JavaScript原生JS中的事件机制:

	事件绑定 事件监听  事件委派

1).事件绑定
通过on方式直接绑定事件,

2). 事件监听:
开发公司: Netacape/JavaScript分别加入了自己的机制

Netscape（即事件捕获）从最外层向内找

IE（即事件冒泡） 从最下层向上冒泡(默认)

w3c公司,针对于这两个公司的不同思想思整合:事件监听

3).格式:
Js对象.addEventListener(‘事件’, function, 事件冒泡(false)/事件捕获(true))

4).阻止事件冒泡或捕获:
w3c的方法是event.stopPropagation()，
IE则是使用event.cancelBubble = true

Ps:阻止冒泡是阻止当前事件往上冒泡.捕获也是阻止当前事件向下捕获

可利用三元运算符写成:

window.event? window.event.cancelBubble = true : e.stopPropagation();

3. 事件委派(Jquery中)

Jquery中的事件分为:
5). 事件绑定
格式1. jq对象.事件(function(){事件体})
格式2. jq对象.on(‘事件’,function(){事件体})
格式3. jq对象.one(‘事件’,function(){事件体})(一次性事件)

Ps:jq中都是事件冒泡,阻止冒泡用 return false

6). 事件委派

jquery中可以给新加入的元素委派事件,即事件委派

格式:
父类元素.on(‘事件名’,’子类元素’,function(){事件体})

10.jQuery位置操作
1）1.offset() 获取元素到可视化窗口的位置集合
与css设置位置的区别在于,offset不考虑自身的margin值,
而css设置位置会考虑本身自带的margin值

设置格式:
.offset({left:值,top:值})

2).position()
如果父类有定位获取 元素到父类的左上距离,如果没有获取 可视化窗口的位置

Ps: 但是不能够设置值

3).全局对象
$(window) 代表整个浏览器窗口
$(document) 代表整个HTML文档

11. jQuery中的尺寸

height() 自身的纯高度,不包括边框,也不包括内补白
width()

innerHeight() 获取自身高度+内容补白之和的高度
innerWidth()

outerHeight() 获取边框高度+内补白+自身高度
outerWidth()