【Jquery-06】jq获取元素的位置和jq的事件

jQuery位置操作

1.获取宽高

语法	用法
width()/height()	只算匹配元素的高/宽
innerWidth()/innerHeight()	元素的高宽+padding
outerWidth()/outerHeight()	元素的高宽+padding+border
outerWifth(true)/outerHeight(true)	元素高宽+padding+border+margin

2位置

1.offset

offset相对于可视区域的位置，与父级无关

有两个属性left/top，offset().top用于获取距离可视区域顶部的位置，offset().left用于获取距离可视区域左侧的位置

可以设置偏移位置

2.position

position()方法用于返回被选元素相对于带有定位父级偏移坐标，如果父级没有定位则相对于html

有两个属性，left、top。position().top用于获取距离定位父级顶部的距离，position().left用于获取距离父级左侧的距离

3.scrollTop()/scrollLeft()

scrollTop()方法设置或返回元素卷曲度（被卷去的上部的距离）

括号里面可以只写数字，代表卷曲转到数字的位置

jQuery的事件

1事件委托

1.单个事件的注册

element.事件(function (){})

2.事件的处理绑定事件

element.on(events,[selector],fn)
第一个参数：事件名，可以同时添加多个事件，用空格分开

第二个参数：选择本身的后代来绑定触发事件，委托谁来执行

第三个参数：当事件被触发时，要传递（event）的数据

第四个参数：执行函数，绑定多个事件

优势：

可以给动态生成的元素绑定事件

可以绑定多个事件，多个处理程序

可以事件委派操作，事件委派的定义就是把原来加给子元素身上的事件绑定在父元素身上

2事件解除

off方法可以移出通过on()方法添加事件处理程序

$("p").off() // 解绑p元素所有事件处理程序

$("p").off( "click")  // 解绑p元素上面的点击事件 

$("ul").off("click", "li");   // 解绑事件委托
one 只进行一次绑定事件

$("p").one('click',function (){

})

3.自触发事件

1.元素.事件()

2.元素.trigger(‘事件’)

3.元素.triggerHander(“事件”)

第三种不会触发元素的默认行为

4.阻止事件行为

js中的内容：

1.阻止默认行为：e.preventDefault()

2.阻止冒泡:e.stopPropagation()

jQuery的内容：
return false