JavaScript:在运行时更改网站图标在弹出窗口中不起作用

时间:2019-12-12 10:17:19

标签: javascript html popup favicon

我要在运行时更改图标图标。在选项卡中打开页面时,我的代码有效,但在弹出窗口中打开页面时,我的代码无效

enter image description here

demo online

我已经在最新的Chrome,Firefox和Edge上进行了测试,但是不能正常运行,但是可以在Internet Explorer 11上运行。

这是用于更改收藏夹图标的代码:

function changeFavicon(src) {
    // delete the current favicon from the DOM
    var oldLink = document.getElementById('appFavicon');
    if (oldLink) {
        document.head.removeChild(oldLink);
    }

    // add the new favicon
    var link = document.createElement('link');
    link.id = 'appFavicon';
    link.rel = 'shortcut icon';
    link.href = src;
    document.head.appendChild(link);
}

这是为gif制作的完整favicon.html

<!doctype html>
<html>
<head>
    <link rel="shortcut icon" id="appFavicon" href="favicon.ico">
</head>
<body>
    <script>
    function popUp(url,windowName) {
       newwindow=window.open(url,windowName,'height=200,width=350');
       if (window.focus) {newwindow.focus()}
       return false;
    }
    function changeFavicon(src) {
        var oldLink = document.getElementById('appFavicon');
        if (oldLink) {
         document.head.removeChild(oldLink);
        }

        var link = document.createElement('link');
        link.id = 'appFavicon';
        link.rel = 'shortcut icon';
        link.href = src;
        document.head.appendChild(link);
    }
    </script>
    <p><button onclick="changeFavicon('https://c5-excel-15.cdn.office.net/x/_layouts/resources/FavIcon_Excel.ico')">Excel</button></p>
    <p><button onclick="changeFavicon('https://c5-powerpoint-15.cdn.office.net/p/resources/1033/FavIcon_Ppt.ico')">Power Point</button></p>
    <p><button onclick="changeFavicon('https://c5-word-view-15.cdn.office.net/wv/resources/1033/FavIcon_Word.ico')">Word</button>
    <br /><br />
    <button onclick="popUp('favicon.html')">Open this page in a PopUp</button></p>
</body>
</html>

0 个答案:

没有答案