隨著現(xiàn)代互聯(lián)網(wǎng)的發(fā)展,人們對(duì)于網(wǎng)絡(luò)設(shè)備的使用需求也不斷增加,如今智能手機(jī)和筆記本電腦等設(shè)備成為了人們娛樂和工作的必備工具。在這么多設(shè)備的存在下,網(wǎng)站開發(fā)人員需要確保其網(wǎng)站能夠被所有設(shè)備無障礙的訪問,因此需要對(duì)于用戶設(shè)備進(jìn)行判定,針對(duì)性的進(jìn)行網(wǎng)站設(shè)計(jì)和開發(fā)。本文重點(diǎn)介紹如何使用javascript判斷用戶是否使用PC設(shè)備。
判斷設(shè)備是PC端還是移動(dòng)端,可以通過網(wǎng)站獲取到的信息,例如HTTP頭中的User-Agent字段,獲取該字段值后,通過判斷字符串是否包含“Mobile”或“iPhone”等關(guān)鍵字,即可判斷當(dāng)前設(shè)備是否為移動(dòng)端。另外,也可以通過判斷瀏覽器窗口尺寸來判斷設(shè)備類型,因?yàn)镻C設(shè)備通常使用大屏幕,因此瀏覽器窗口尺寸會(huì)較大。
function isPC(){
var userAgentInfo = navigator.userAgent;
var Agents = ["Android", "iPhone",
"SymbianOS", "Windows Phone",
"iPad", "iPod"];
var flag = true;
for (var i = 0; i< Agents.length; i++) {
if (userAgentInfo.indexOf(Agents[i]) >0) {
flag = false;
break;
}
}
return flag;
}
通過獲取瀏覽器窗口尺寸判斷設(shè)備類型:
function isPC(){
var sUserAgent = navigator.userAgent.toLowerCase();
var bIsIpad = sUserAgent.match(/ipad/i) == "ipad";
var bIsIphoneOs = sUserAgent.match(/iphone os/);
var bIsMidp = sUserAgent.match(/midp/i) == "midp";
var bIsUc = sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
var bIsAndroid = sUserAgent.match(/android/i) == "android";
var bIsCE = sUserAgent.match(/windows ce/i) == "windows ce";
var bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile";
if (bIsIpad || bIsIphoneOs || bIsMidp || bIsUc || bIsAndroid || bIsCE || bIsWM) {
return false;
} else {
return true;
}
}
上述代碼通過用戶代理(User-Agent)字段及正則表達(dá)式匹配判斷是否為移動(dòng)設(shè)備,如果匹配則return false,否則return true。
除了以上兩種判斷方式外,還有一種更簡(jiǎn)單的方法:通過判斷是否存在document.documentElement.clientWidth屬性來判斷設(shè)備類型。這個(gè)屬性表示的是當(dāng)前網(wǎng)頁文檔在瀏覽器窗口中可見區(qū)域的大小。對(duì)于PC設(shè)備來說,這個(gè)屬性值通常較大,對(duì)于移動(dòng)設(shè)備來說則通常較小。
function isPC(){
var screenWidth = window.screen.width;
var screenHeight = window.screen.height;
var documentWidth = document.documentElement.clientWidth;
var documentHeight = document.documentElement.clientHeight;
if(documentWidth >700)
{
return true;
}
else
{
return false;
}
}
本文主要介紹了javascript判斷pc設(shè)備的方法,其中包括獲取用戶代理字段,通過正則表達(dá)式匹配判斷是否為移動(dòng)設(shè)備,以及通過獲取瀏覽器窗口尺寸或者文檔可見區(qū)域尺寸來判斷設(shè)備類型。對(duì)于網(wǎng)站開發(fā)人員來說,了解這些判斷方法將有助于更好的針對(duì)用戶設(shè)備進(jìn)行網(wǎng)站設(shè)計(jì)和開發(fā),提升用戶體驗(yàn),增加網(wǎng)站流量。