快速判斷瀏覽器是否支持特定css、js功能

lordharrd 發布于2019-08-21 15:39 / 3134人閱讀

摘要：，通過進行瀏覽器功能檢測通過可以判斷某一功能是否能夠被當前瀏覽器支持，是一個可以插入到你的網頁里面的文件，通過調用內部的函數可以完成對當前瀏覽器的某一功能的檢驗。我們已經可以通過來判斷某一功能能否被當前瀏覽器所支持。

作為html5開發人員常常面臨兼容性和新功能之間的抉擇，為了解決這一問題，我們會采取不同的方案，按照問題解決的遞進關系可以分為3步（避免問題和解決問題）：1，了解主流瀏覽器對于制定html5功能的支持情況，如果能夠得到期望的瀏覽器的支持，那么可以使用，否則不實用。在了解瀏覽器的支持情況后，還需要瀏覽器的裝機情況，這樣可以進一步了解目標用戶對于新功能是否有足夠的支持；2，針對一臺具體的用戶電腦瀏覽器查詢特定的功能時候能夠被支持（所謂診斷），可以使用modernizr技術來解決；3mo d針對診斷結果采取解決方案，可以使用膩子腳本來解決（所謂醫治）。

1，了解瀏覽器的支持情況和瀏覽器在用戶中的使用情況

可以通過專門的統計網站caniuse來了解這些情況，

簡單說明一下它的使用。上圖（caniuse首頁截圖）是網站內容，在綠框中輸入你所需要的html5新功能名字，即可查詢對應的使用情況。

caniuse查詢結果
在查詢結果中可以看到各個主流瀏覽器的不同版本對于這個功能支持情況。值得注意的是國內一些瀏覽器大多是盒子瀏覽器，采用別人的瀏覽器內核。如QQ瀏覽器采用的IE內核（支持情況取決于你電腦上安裝的IE版本），360瀏覽器采用的是chrome＋IE瀏覽器雙核，百度瀏覽器同樣是雙核。具體版本可以通過到官網上進行查詢。這些瀏覽器會基于內核進行優化，所以不能簡單根據內核版本判斷支持情況，但內核版本可以作為充要條件。

2，通過modernizr進行瀏覽器功能檢測

通過modernizr可以判斷某一功能是否能夠被當前瀏覽器支持，modernizr是一個可以插入到你的網頁里面的js文件，通過調用內部的函數可以完成對當前瀏覽器的某一功能的檢驗。使用方法如下：

1，下載modernizr的js文件。2，將文件放入到你的網頁所在的文件夾內。3，在你的網頁的head標簽中加入對這個js文件的使用。4，編寫腳本執行檢測功能，并將結果輸出到頁面中去。

3，通過膩子腳本來解決兼容性的問題。

我們已經可以通過modernizr來判斷某一功能能否被當前瀏覽器所支持。但是這一結果不能幫助瀏覽器進行正確的現實為了解決這一問題，我們可以通過膩子腳本的方式來解決。針對不同html功能會有膩子腳本來解決，然而膩子腳本的的品質確不一能保證。這是膩子腳本的集合

云服務器 GPU云服務器判斷瀏覽器是否支持webrtc 判斷是否支持webrtc 微信瀏覽器是否支持webrtc 瀏覽器對和css3的支持

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/88255.html

快速判斷瀏覽器是否支持特定css、js功能

摘要：，通過進行瀏覽器功能檢測通過可以判斷某一功能是否能夠被當前瀏覽器支持，是一個可以插入到你的網頁里面的文件，通過調用內部的函數可以完成對當前瀏覽器的某一功能的檢驗。我們已經可以通過來判斷某一功能能否被當前瀏覽器所支持。作為html5開發人員常常面臨兼容性和新功能之間的抉擇，為了解決這一問題，我們會采取不同的方案，按照問題解決的遞進關系可以分為3步（避免問題和解決問題）：1，了解主流瀏覽...

jokester 2019-08-29 12:29 評論0 收藏0
面試官(6): 寫過『通用前端組件』嗎?

摘要：很久沒上掘金發現草稿箱里存了好幾篇沒發的文章最近梳理下發出來往期面試官系列如何實現深克隆面試官系列的實現面試官系列前端路由的實現面試官系列基于數據劫持的雙向綁定優勢所在面試官系列你為什么使用前端框架前言設計前端組件是最能考驗開發者基本功的測很久沒上掘金,發現草稿箱里存了好幾篇沒發的文章,最近梳理下發出來往期面試官系列(1): 如何實現深克隆面試官系列(2): Event Bus...

waltr 2019-05-27 17:43 評論0 收藏0
瀏覽器兼容問題

摘要：一什么是瀏覽器兼容問題所謂的瀏覽器兼容性問題，是指因為不同的瀏覽器對同一段代碼有不同的解析，造成頁面顯示效果不統一的情況。條件注釋最初于微軟的瀏覽器中出現，并且直至均支持。一、什么是瀏覽器兼容問題所謂的瀏覽器兼容性問題，是指因為不同的瀏覽器對同一段代碼有不同的解析，造成頁面顯示效果不統一的情況。在大多數情況下，我們的需求是，無論用戶用什么瀏覽器來查看我們的網站或者登陸我們的系統，都...

wenshi11019 2019-08-26 13:57 評論0 收藏0
jQuery筆記總結篇

摘要：希望在做所有事情之前，操作文檔。不受層級限制子選擇器在給定的父元素下匹配所有子元素。相鄰選擇器匹配所有緊接在元素后的元素。判斷當前對象中的某個元素是否包含指定類名，包含返回，不包含返回下標過濾器精確選出指定下標元素獲取第個元素。原文鏈接 http://blog.poetries.top/2016... 首先，來了解一下jQuery學習的整體思路 showImg(https://seg...

NoraXie 2019-08-22 10:39 評論0 收藏0