如何使用 Javascript 删除非自托管网站上的网站图标？

Question

<link rel="shortcut icon" href="https://files.writeas.org/favicon.ico" />是网站中的代码吗，我无法更改它，我只能更改 CSS 或注入我自己的 Javascript，那么我如何使用 Javascript 获取这部分 HTML 代码并注释掉/覆盖它从而删除它？

Answer 1

如果您无法删除它，您可以使用以下代码更改它（注意：删除可能还不够，因为许多浏览器默认为 /favicon.ico）

//const ico_url = document.location.origin + '/favicon.ico'

const ico_url = 'https://api.adorable.io/avatar/256/your_icon.png'

let head = document.getElementsByTagName('head')[0]

console.dir(head)

var link;

let links = head.getElementsByTagName('link')

for(let i=0; i<links.length; i++) {

   if (links[i].rel == 'icon' || links[i].rel == 'shortcut icon') {

      link = links[i]

      console.log('old-icon: '+link.href)

      link.href = ico_url

      console.log('new-icon: '+link.href)

 

   }

}

if (typeof(link) == 'undefined') {

 console.log('creating favicon link !')

 link = document.createElement('link')

 link.setAttribute('rel','icon')

 link.setAttribute('type','image/png')

 link.setAttribute('href',ico_url) // new favicon ...

 document.getElementsByTagName('head')[0].appendChild(link)

}

console.log(link.href)

Answer 2

也许你可以尝试更换 head 标签...

let ico_url = 'https://api.adorable.io/avatar/256/head_icon.png'

 var head = document.createElement("head");

 link = document.createElement('link')

 link.setAttribute('rel','icon')

 link.setAttribute('type','image/png')

 link.setAttribute('href',ico_url) // new favicon ...

 head.appendChild(link)

 const html = document.getElementsByTagName('html')[0]

 html.appendChild(head)

 html.replaceChild(head,document.getElementsByTagName('head')[0])

console.dir(head)