JS 绑定及解绑事宜
事宜绑定的三种体式格局
.addEventListener('事宜范例',定名函数,布尔值)
//IE8不支撑 (this代表的是当前绑定事宜的对象).removeEventListener('事宜范例',函数名字,false)
//移除事宜
(注重:addEventListener中的第三个参数设置为true就在捕捉过程当中实行,反之就在冒泡过程当中实行处置惩罚函数。).attachEvent('on事宜范例',定名函数)
//谷歌,火狐不支撑 this代表的是window.detachEvent('on事宜范例',函数名字)
//解绑事宜对象.on事宜名字 = 事宜处置惩罚函数--->绑定事宜
对象.on事宜名字 = null
- 事宜冒泡:多个元素嵌套,有条理关联,这些元素都注册了雷同的事宜,假如内里的元素的事宜触发了,表面的元素的该事宜自动的触发了.
- 怎样阻挠事宜冒泡:
window.event.cancelBubble=true;
IE特有的,谷歌支撑,火狐不支撑。event.stopPropagation();
阻挠事宜冒泡—->谷歌和火狐支撑- event对象的经常运用属性:
var e = event || window.event
// window.event和e都是事宜参数对象,一个是IE的规范,一个是火狐的规范event.type
//事宜范例event.target
//事宜触发的元素
JS 事宜范例
在元素的事宜处置惩罚器中:this指代的就是元素本身
.onclick
//点击事宜.onmouseover (鼠标移入事宜)
/.onmouseout(鼠标移出事宜)
.onfocus (输入框猎取核心)
/.onblur(输入框落空核心)
.onkeydown (按下键盘某个键)
/.onkeyup (按下某个键弹起)
JS element元素属性
.innerText
(谷歌,火狐,IE8都支撑) /.textContent
(不支撑IE8).innerHTML
(标签内容能够被辨认).setAttribute("属性的名字","属性的值")
//设置自定义属性.getAttribute("属性的名字")
//猎取自定义属性的值.removeAttribute("属性的名字")
//移除自定义属性.style.backgroundColor
//style属性另有许多其他属性.getAttributeNode('id')
//猎取的是元素的键名为‘id’的属性节点.parentElement
//父级元素.childNodes
//子节点.children
//猎取子元素.nodeType
//节点范例 1—-标签,2—属性,3—文本.nodeName
//节点名字 标签节点—大写的标签名字,属性节点—小写的属性名字,文本节点—-#text.nodeValue
//节点的值 标签节点—null,属性节点—属性值,文本节点—文本内容.parentNode
//父级节点.firstChild
//第一个子节点.firstElementChild
//第一个子元素.lastChild
//末了一个子节点.lastElementChild
//末了一个子元素.previousSibling
//前一个兄弟节点.previousElementSibling
//前一个兄弟元素.nextSibling
//后一个兄弟节点.nextElementSibling
//后一个兄弟元素
JS element元素要领
.appendChild( obj1)
//追加元素.insertBefore( obj1,obj2 )
//将obj1插进去到第二个参数元素obj2之前.replaceChild( obj1,obj2 )
//替代个中某个元素.removeChild( obj1 )
//删除个中某个元素
JS offset、scroll、client系列的值
style标签中设置的款式属性是猎取不到的,然而在标签中设置的style属性的值时能够猎取到的。
猎取元素的宽高,运用offset系列的值
offsetWidth
//猎取元素的宽,有边框offsetHeight
//猎取元素的高,有边框offsetLeft
//猎取元素间隔左侧位置的值offsetTop
//猎取元素间隔上边位置的值scrollLeft
//向左卷曲出去的间隔scrollTop
//向上卷曲出去的间隔scrollWidth
//元素中内容现实的宽(假如内容较少,没有内容,就是元素本身的宽),没有边框scrollHeight
//元素中内容现实的高(假如内容较少,没有内容,就是元素本身的高),没有边框clientWidth
//可视地区的宽(没有边框),边框内部的宽clientHeight
//可视地区的高(没有边框),边框内部的高clientLeft
//左侧框宽度clientTop
//上边框宽度event.clientX
、event.clientY
//鼠标相对于浏览器窗口可视地区的X,Y坐标(窗口坐标),可视地区不包括工具栏和滚动条event.pageX
、event.pageY
//类似于event.clientX、event.clientY,但它们运用的是文档坐标而非窗口坐标(IE8不可用)