兼容多數瀏覽器的js添加收藏夾腳本

瀏覽器不斷髮展，js的不少腳本須要跟進才能適應，目前多數代碼對新版本瀏覽器(IE11, Firefox 27)沒法適用，特關注跟進。

推薦代碼1

適用瀏覽器：IE11(windows 8.1), Firefox 37.0.1(windows 8.1),

不適用瀏覽器：IE6(windows xp),

測試代碼

<script type="text/javascript">
function addFavorite(){
    var bookmarkUrl = "http://baidu.com";
    var bookmarkTitle = "baidu";

    if (window.sidebar) { // For Mozilla Firefox Bookmark
        window.sidebar.addPanel(bookmarkTitle, bookmarkUrl,"");
    } else if( window.external || document.all) { // For IE Favorite
        window.external.AddFavorite( bookmarkUrl, bookmarkTitle);
    } else { // for other browsers which does not support
         alert('瀏覽器不支持,請按 Ctrl+D 手動收藏!');
         return false;
    }
}
</script><a href="#" rel="sidebar" onclick="addFavorite()">加入收藏</a>

 解釋說明

1. Firefox 37中廢除了window.sidebar.addPanel的功能，若是要使用須要在<a>標籤中添加rel="sidebar"才能使用。

2. IE11/Firefox 37中均存在window.external和document.all，所以須要將專門針對Firefox的判斷if (window.sidebar)放在前面判斷。

 

推薦代碼2

jQuery.fn.addFavorite = function(l, h) {
        return this.click(function() {
            var obj = $(this);
            if($.browser.msie) {
                window.external.addFavorite(h, l);
            } else if (jQuery.browser.mozilla || jQuery.browser.opera) {
                obj.attr("rel", "sidebar");
                obj.attr("title", l);
                obj.attr("href", h);
            } else {
                alert("請使用Ctrl+D將本頁加入收藏夾！");
            }
        });
    };
    $('#fav').addFavorite('收藏本站',location.href);

不適用於IE11：需改進。

 

 Javascript代碼獲取瀏覽器的User-Agent信息：navigator.userAgent

navigator.userAgent
"Mozilla/5.0 (Windows NT 6.3; WOW64; Trident/7.0; .NET4.0E; .NET4.0C; .NET CLR 3.5.30729; .NET CLR 2.0.50727; .NET CLR 3.0.30729; Tablet PC 2.0; rv:11.0) like Gecko"

IE11(windows 8.1)報文請求頭：
User-Agent: "Mozilla/5.0 (Windows NT 6.3; WOW64; Trident/7.0; rv:11.0) like Gecko"

Firefox 37(windows 8.1)報文請求頭：
User-Agent: "Mozilla/5.0 (Windows NT 6.3; WOW64; rv:37.0) Gecko/20100101 Firefox/37.0"

Chrome 41:
"Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/41.0.2272.101 Safari/537.36"

 

目標

找到適用於儘量多瀏覽器的js代碼，封裝，開放，共享。

 

參考：

[1] http://stackoverflow.com/questions/5828965/bookmark-on-click-using-jquery

[2] IE11 用戶代理字符串User-Agent(UA)更改--MSDN

[3] JqueryBookmark--Github

[4] jquery實現「加入收藏」功能 (不兼容IE11，需改進)

[5] how to detect IE11 using jquery