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);