網頁制作Webjx文章簡介：js判斷瀏覽器是否支持css3屬性。

var cssSupports = (function() {
 var div = document.createElement('div'),
  vendors = 'Khtml O Moz Webkit'.split(' '),
  len = vendors.length;
 return function(prop) {
  if ( prop in div.style ) return true;
  if ('-ms-' + prop in div.style) return true;
  
  prop = prop.replace(/^[a-z]/, function(val) {
   return val.toUpperCase();
  });

  while(len--) {
   if ( vendors[len] + prop in div.style ) {
   return true;
  }
 }
  return false;
 };
})();

判斷瀏覽器是否支持border-radius，支持則給html添加class為border-radius，否則添加class為no-border-radius

if(cssSupports('borderRadius')){
 var oHtml = document.documentElement;
 oHtml.className += ' border-radius';
}else{
 oHtml.className += ' no-border-radius';
}

因為這個flex是出現在display的值上面的，而我們上面的方法其實只適用于屬性，所以直接是不行的，我們可以通過曲線的方法來判斷，和flex相關的還有很多其他的屬性如order,align-content,align-item,align-slef等，我們就用最簡單的order來曲線判斷是否支持flex吧。（注意因為flex除了標準版本外，還有其他兩個版本，這里只挑標準的屬性判斷）

if(cssSupports('order')){
 var oHtml = document.documentElement;
 oHtml.className += ' flex';
}else{
 oHtml.className += ' no-flex';
}

如果你對上面那段js有點不明白，你可以在控制臺運行這段代碼，就會看到所有style的屬性

(function(){
 var oDiv = document.createElement('div');

 for(var prop in oDiv.style){
  console.log(prop);
 }
})();