如何根據瀏覽器替換頁面上的元素？

我爲一個在線遊戲聯盟創建了一個網站，其中的問題在於它的頭部有一個應該自動播放的HTML5視頻。它在Chrome和Firefox中表現良好。在Internet Explorer中播放，但無法正確顯示，並且在Safari中根本不顯示。爲了解決這個問題，有什麼方法可以讓視頻在這些瀏覽器上替換爲標準圖像？還是有人有這兩個瀏覽器的修復？謝謝。如何根據瀏覽器替換頁面上的元素？

來源

2014-10-07 Tom

http://modernizr.com/這可以幫助您檢測瀏覽器，並解決許多問題。無論如何，應該從IE 9+和safari支持HTML 5視頻元素。自動播放是問題還是..？如果是這樣，你可以使用JavaScript解決它。 – briosheje 2014-10-07 16:24:59

modernizr用於功能檢測...不是瀏覽器檢測。 – 2014-10-07 16:26:01

@Paulie_D：他需要檢測瀏覽器是否首先支持HTML 5，不是嗎？ – briosheje 2014-10-07 16:29:48

你有幾個選擇，但請記住，沒有一個是防彈的，你的實現將取決於你正在編寫的代碼的類型（服務器端像PHP，或客戶端像JS）。

以下是一些建議，希望能讓您走上正確的道路。

您可以嘗試使用用戶代理字符串檢測瀏覽器服務器端。您可以手動解析字符串或（在我的建議中）使用內置的函數/庫。請參閱本主題的更多信息：

Code to parse user agent string?

那麼你會修改你的HTML輸出包含或不包含使用一組服務器端if報表要素。

您可以使用JS在HTML呈現後檢測瀏覽器客戶端。這裏有幾個圖書館可以完成這項工作。您可能需要使用jQuery。

https://github.com/WhichBrowser/WhichBrowser

https://github.com/gabceb/jquery-browser-plugin

然後你可以使用類似的.show（）/。藏起來（）或一個.remove（）jQuery函數修改HTML。

來源

2014-10-07 16:27:29 Alex

我不確定如何做到這一點，如果它有助於我遇到問題的鏈接是www.testingfortagpro.meximas.com。如果我只能得到一個命令說，如果使用Internet Explorer或Safari瀏覽器替換爲例如logo.jpg的視頻，這將做到這一點。 – Tom 2014-10-07 16:59:39

如果您對我提供的鏈接進行一些閱讀，您將能夠弄清楚如何完成您想要的功能。 – Alex 2014-10-07 18:05:19

您可以使用下面的JavaScript代碼，找出瀏覽器的名稱和版本：基於

navigator.sayswho= (function(){ 
var ua= navigator.userAgent, tem, 
M= ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || []; 
if(/trident/i.test(M[1])){ 
    tem= /\brv[ :]+(\d+)/g.exec(ua) || []; 
    return 'IE '+(tem[1] || ''); 
} 
if(M[1]=== 'Chrome'){ 
    tem= ua.match(/\bOPR\/(\d+)/) 
    if(tem!= null) return 'Opera '+tem[1]; 
} 
M= M[2]? [M[1], M[2]]: [navigator.appName, navigator.appVersion, '-?']; 
if((tem= ua.match(/version\/(\d+)/i))!= null) M.splice(1, 1, tem[1]); 
return M.join(' '); 
})();

什麼你想接下來做的就是測試這個字符串中的值（如"IE 9"）和輸出代碼一個if子句。

另請參閱Browser detection in JavaScript?

來源

2014-10-07 16:32:08 pattyd

如何根據瀏覽器替換頁面上的元素？

回答

相關問題