html中判断phone与pc的ce

背景：在写html页面的时候，要对不同平台展示不同的页面(或者内容)

方式一：

<script type="text/javascript">
$(document).ready(function () {

function browserRedirect() {
var sUserAgent = navigator.userAgent.toLowerCase();
var bIsIpad = sUserAgent.match(/ipad/i) == "ipad";
var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os";
var bIsMidp = sUserAgent.match(/midp/i) == "midp";
var bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
var bIsUc = sUserAgent.match(/ucweb/i) == "ucweb";
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";
// document.writeln("您的浏览设备为：");
if (bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) {
// document.writeln("phone");
// $("#platform").text("您的浏览设备为： phone");
$("#platform").show();
} else {
// document.writeln("pc");
// $("#platform").text(" 您的浏览设备为：pc");
$("#platform").hide();
}
}


// browserRedirect();

});

</script>

方式二：判断当前html的展示页面大小,css media query

@media screen and (min-width: 0px) and (max-width: 600px) {
    #platform { display: block; }  /* show it on small screens */
}


@media screen and (min-width: 600px) {
#platform { display: none; }   /* hide it elsewhere */
}

通过media来判断当前页面展示的大小，然后隐藏platform div