jQ位置 事件

DOM操作:
复制节点:
原生:cloneNode()
jQ:clone() 节点.clone(true) true:该节点及它的内容全部复制

添加同辈节点(外部添加)
after:在指定节点后添加新内容
语法:目标节点.after(新节点)
insertAfter:将新内容添加到指定节点后
语法:新节点.insertAfter


位置操作:
原生JS:
offsetLeft offsetTop
jQ:
offset()方法:获取元素相对于视口/页面的位置
返回值:对象,它包括left和top属性
左侧:offset().left 右侧:offset().right

鼠标坐标:
原生JS:
事件对象.PageX 相对页面坐标
事件对象.offsetX 相对于元素坐标
事件对象.clientX 相对于视口
事件对象.screenX 相对屏幕
jQ:

取消默认行为 preventDefault()
组织冒泡 stopPropagetion()


删除事件
DOM0 元素.onclick=null
DOM2 removeEventListener()
jQ:通过on方法绑定的时间 off()
元素.off('click')
通过bind绑定事件 unbind()
通过delegate绑定的事件 undelegate()


尺寸操作
原生 offsetWidth offsetHeight
jQ:width() height():获取或设置元素的内部尺寸
innerWidth() innerHeigth :获取元素内部宽度(padding+width/height)
outerWidth() outerHeight():获取元素外部边框(padding+border+width/height)
outerWidth(true) outerHeight(true):获取元素所有 (padding+border+margin+width/height)


动画:animate():给css添加自定义动画
元素.animate({“css属性名”:值,},【时长】,fn)
说明:时长动画持续的时间
fn:动画结束之后执行的函数
以上两个参数可以省略

小结:
DOM操作:
节点的操作:
添加:
内部(子节点):append() appendTo() prepend() prependTo()
外部(隔辈节点):after() insertAfter() before() insertBefore()
创建节点:$("html")
复制节点:clone(true)
删除节点:remove() empty()清空节点
替换节点
包裹节点
尺寸设置

猜你喜欢

转载自www.cnblogs.com/mapsxy/p/9285616.html