瀏覽器相容性JS問題

2021-09-24 13:14:39 字數 2431 閱讀 6060

常遇到的關於瀏覽器的寬高問題:

//以下均可console.log()實驗

var winw=document.body.clientwidth||document.docuemntelement.clientwidth;//網頁可見區域寬

var winh=document.body.clientheight||document.docuemntelement.clientheight;//網頁可見區域寬

//以上為不包括邊框的寬高,如果是offsetwidth或者offsetheight的話包括邊框

var winww=document.body.scrollwidth||document.docuemntelement.scrollwidth;//整個網頁的寬

var winhh=document.body.scrollheight||document.docuemntelement.scrollheight;//整個網頁的高

var scrollheight=document.body.scrolltop||document.docuemntelement.scrolltop;//網頁被卷去的高

var scrollleft=document.body.scrollleft||document.docuemntelement.scrollleft;//網頁左捲的距離

var screenh=window.screen.height;//螢幕解析度的高

var screenw=window.screen.width;//螢幕解析度的寬

var screenx=window.screenleft;//瀏覽器視窗相對於螢幕的x座標(除了firefox)

var screenxx=window.screenx;//firefox相對於螢幕的x座標

var screeny=window.screentop;//瀏覽器視窗相對於螢幕的y座標(除了firefox)

var screenyy=window.screeny;//firefox相對於螢幕的y座標

//event事件問題

document.οnclick=function(ev)

document.οnclick=function()

document.οnclick=function(ev)

//dom節點相關,主要相容ie 6 7 8

function nextnode(obj) else;

}function prenode(obj) else;

}function firstnode(obj) else;

}function lastnode(obj) else;

}//通過類名獲取元素

document.getelementsbyclassname('');//ie 6 7 8不支援;

//這裡可以定義乙個函式來解決相容問題,當然別在這給我提jquery...

//第乙個為全域性獲取類名,第二個為區域性獲取類名

function byclass1(oclass);

};return arr;//注意返回的也是陣列,包含你傳入的class所有元素;

}function byclass2(parentid,oclass);

};return arr;//注意返回的也是陣列,包含你傳入的class所有元素;

}//獲取元素的非行間樣式值

function getstyle(object,ocss) else

}//設定監聽事件

function addevent(obj,type,fn) else;

}function removeevent(obj,type,fn) else;

}//在這裡加個元素到瀏覽器邊緣的距離,很實用

function offsettl(obj)

return;

}//js阻止事件傳播,這裡使用click事件為例

document.οnclick=function(e)else

}//js阻止預設事件

document.οnclick=function(e)else

}//關於event事件中的target

document.οnmοuseοver=function(e)

//滑鼠滾輪事件

//火狐中的滾輪事件

document.addeventlistener("dommousescroll",function(event),false)

//非火狐中的滾輪事件

document.onmousewheel=function(event)

//火狐下特有的節點載入事件,就是節點載入完才執行,和onload不同

//感覺用到的不多,直接把js**放在頁面結構後面一樣能實現。。

document.addeventlistener('domcontentloaded',function ( ){},false);//dom載入完成。好像除ie6-8都可以.ß

js之瀏覽器相容性

1 ie瀏覽器不支援函式預設值 hi 李四 function hi msg 張三 此函式在火狐 谷歌等瀏覽器下均沒問題,唯獨在萬惡的ie瀏覽器下會提示如下錯誤 為什麼會出現這樣的問題呢?在es6之前,不能直接為函式的引數指定預設值,chrome,firefox,safari等瀏覽器對es6支援較好,...

瀏覽器相容性

瀏覽器相容性是乙個很長久的話題,之所以前端需要面對瀏覽器相容性,是因為使用者的環境有不同的平台,不同的瀏覽器。不同的廠商之間為了相互競爭,對標準的實現不一樣。不同的瀏覽器有不同的核心。即使同乙個瀏覽器也有不同的版本,不同的版本對同一特性的支援情況也不盡相同。也可能某個瀏覽器的某個版本針對某個特性存在...

瀏覽器相容性

所謂的瀏覽器相容性問題,是指因為不同的瀏覽器對同一段 有不同的解析,造成頁面顯示效果不統一的情況。在大多數情況下,我們的需求是,無論使用者用什麼瀏覽器來檢視我們的 或者登陸我們的系統,都應該是統一的顯示效果。所以瀏覽器的相容性問題是前端開發人員經常會碰到和必須要解決的問題。在學習瀏覽器相容性之前,我...