- 1.獲取鼠標(biāo)鍵值
document.onkeydown = function (event){//測試鼠標(biāo)鍵值的函數(shù)
var evt = event || window.event;
console.log(evt.which || evt.keyCode)
return evt.which || evt.keyCode;
}
- 2.獲取頁面滾動高度
document.body.scrolltop || document. documentElement.scrolltop
document.body.clientHeight || document.documentElement.clientHeight
- 3.事件兼容
function(event){
var evt = event || window.event
}
- 4.阻止冒泡
e.stopPropagation(); 標(biāo)準(zhǔn)寫法
e.cancelBubble = true; IE寫法
e.stopPropagation ? e.stopPropagation() : e.cancelBubble = true;
- 5阻止默認(rèn)事件
e.preventDefault(); 標(biāo)準(zhǔn)寫法
e.returnValue = false; IE寫法
e.preventDefault ? e.preventDefault() : e.returnValue = false;
新版本 直接returnfalse
- 6事件監(jiān)聽的添加移除
添加監(jiān)聽的一般寫法
function addEvent(DOM,name,callback){//添加事件監(jiān)聽的兼容函數(shù)需要傳入的參數(shù)有dom元素拉馋，事件名庵佣，和函數(shù)名需要事先定義函數(shù)
if(DOM.addEventListener){
DOM.addEventListener(name,callback);
}else{
DOM.attachEvent("on"+name,callback);
}
}
添加監(jiān)聽的高級寫法 prototype 屬性使您有能力向?qū)ο筇砑訉傩院头椒ā?
Element.prototype.addEvent = function(name,fn){ //固定寫法向原型中添加方法
if(this.addEventListener){
this.addEventListener(name,fn);
}else{
this.attachEvent("on" + name,fn)
}
}
oBtn.addEvent("click",function(){
alert(1);
});
移除監(jiān)聽的一般寫法
function removeEvent(DOM,name,fn){
//console.log(fn);//事件處理函數(shù)?;
if(DOM.addEventListener){
DOM.removeEventListener(name,fn);
}else{
DOM.detachEvent("on" + name,fn)
}
}
- 7.事件委托
function delegation(select,callback){ //事件委托的函數(shù)兼容
return function(event){
//1.限制范圍; 點(diǎn)誰有效,點(diǎn)誰無效;
var evt = event || window.event;
// console.log(evt.target)
if(evt.target.nodeName == select){
callback.call(evt.target)
}
}
}
8.改變this指向的兩種方法
原先用call
function fn( ){
console.log(this)
}
fn.call(123)
//結(jié)果為123
bind改變
function fn(){
]}.bind()//運(yùn)行時會報(bào)錯
因?yàn)閎ind只能綁定給未命名函數(shù)
這時
var fn = function (){
console.log(this)
}.bind(123)
fn();
這樣就不會報(bào)錯了
- 9獲取非行內(nèi)樣式的方法
box.currentStyle.width //IE
window.getComputedStyle(box, null).width //非IE
style = box.currentStyle || getComputedStyle(box,null) ;
- 10獲取鼠標(biāo)的信息
鼠標(biāo)鍵值
function(event){
var evt = event || window.event // 推薦使用 兼容性好
evt.button// 鼠標(biāo)鍵值 左鍵0 中建 1右鍵 2
}
鼠標(biāo)位置（坐標(biāo)）
obox.onmousedown = function( event ){
var evt = event || window.event
//1 offsetX offsetY
//最小區(qū)域的位置信息相對于最近的父元素根據(jù)時間發(fā)生的元素
//2 clientX clientY
//可視區(qū)根據(jù)瀏覽器寬高
//3 screenX screenY
根據(jù)屏幕的邊
}
- 11過濾文本節(jié)點(diǎn)
var list = document.getElementsById().childNodes;
var newlist = [];
for(var i=0; i<list.length; i++){
if(list[i].nodeType == 1){
newlist.push(list[i]);
}
}
