flash收藏圖片來回

Question

我正在嘗試運行一段代碼，以無限期地在每秒鐘之間來回閃爍圖標。到目前爲止，我已經得到了一次改變它的代碼，但不是再次;

var favUrl = "favicon.ico"; 
var flashFavIco = function() { 
    if(favUrl == "favicon.ico") { 
     favUrl = "favicon-white.ico"; 
    } else { 
     favUrl = "favicon.ico"; 
    } 
    console.log(favUrl); 
    var link = document.createElement('link'); 
    link.type = 'image/x-icon'; 
    link.rel = 'shortcut icon'; 
    link.href = 'http://www.mysite.com/' + favUrl; 
    document.getElementsByTagName('head')[0].appendChild(link); 
}; 
setInterval(flashFavIco, 1000); 

我測試在如果/其他部分添加console.log() s到檢查favURL正在設置的每個第二，它確實。所以我有點卡住，爲什麼favicon只改變一次。這是瀏覽器問題嗎？

編輯：我不認識到這一點不斷地增加新的<link ...標籤的頭，我正在寫一個appendChild部分不同，這並不影響我原來的問題

Answer 1

我重新寫了一部分它現在有它的工作;

var favUrl = "favicon.ico"; 
var link = document.createElement('link'); 
    link.type = 'image/x-icon'; 
    link.rel = 'shortcut icon'; 
    link.href = 'http://www.mysite.com/' + favUrl; 
    link.id = "favico"; 
document.getElementsByTagName('head')[0].appendChild(link); 

var flashFavIco = function() { 
    if(favUrl == "favicon.ico") { 
     favUrl = "favicon-white.ico"; 
    } else { 
     favUrl = "favicon.ico"; 
    } 
    $('#favico').prop('href', 'http://www.mysite.com/' + favUrl); 
}; 
setInterval(flashFavIco, 1000); 

Answer 2

爲您重寫。

// Edit these 
var faviconNormal = "/faviconNormal.ico"; 
var faviconActive = "/faviconActive.ico"; 
var faviconID = "#myfavicon"; // CSS selector for your <link> element 

// Declarations 
var faviconElement = document.querySelector(faviconID); 
var faviconIsActive = false; 

function flashFavicon() { 
    if (faviconIsActive == false) { 
     changeFavicon(faviconActive); 
     faviconIsActive = true; 
    } 
    else { 
     changeFavicon(faviconNormal); 
     faviconIsActive = false; 
    } 
} 

function changeFavicon(src) { 
    faviconElement.href = src; 
} 

// Run 
var initFlashing = setInterval(flashFavicon, 1000);