shifferman Posted January 7, 2011 Share Posted January 7, 2011 Hello,I am looking for a way to add a favicon to a website using JS. I am familiar with the regular way to do it - via the <head> section - but the problem is right there, I have no access to the <head> section, only to the <body> (I have no access to the server, it's an affiliated site). So I am looking for a way to do it from the <body> section. If someone knows of a way, please let me know.Thank you. Link to comment Share on other sites More sharing options...
justsomeguy Posted January 7, 2011 Share Posted January 7, 2011 You can try to use the DOM methods to create a new element with the attributes you need and append it to the head, but I'm not sure if the browser will treat it the same way. Link to comment Share on other sites More sharing options...
jeffman Posted January 7, 2011 Share Posted January 7, 2011 I got curious, so I tried this code: var myHead = document.getElementsByTagName('head')[0];var myLink = document.createElement('link');myLink.href = "favicon.ico";myLink.rel = "shortcut icon";myHead.insertBefore(myLink, myHead.firstChild); In every browser I tried, the element was successfully added to the DOM. But being in the DOM is not enough.Firefox actually did what you want, and the icon was displayed. Chrome/Safari did not display it, and neither did Explorer 7-8.This was the behavior I actually expected. My guess is that most browsers only look for the favicon at page load, and then they're done with that. This is really sort of dumb, since essentially the same technique will cause any browser to change the src of a stylesheet link.Then again, it may have something to do with the way browsers look for a favicon one place, then another, then another, till success or failure. That makes the icon link quite a bit different from a stylesheet link.Either way, disappointing. Link to comment Share on other sites More sharing options...
shifferman Posted January 12, 2011 Author Share Posted January 12, 2011 From here to there... This is still an unsolved issue I guess. Why don't we make it a mini-project, I'm sure I'm not the only one who could use a good solution for this.OK now, where is the brainiak who will solve this enigma??? Link to comment Share on other sites More sharing options...
justsomeguy Posted January 12, 2011 Share Posted January 12, 2011 They're working for Apple, Google, and Microsoft, just waiting for you to submit a change request to their browser teams. If the browser doesn't support something like that you can't force it. Link to comment Share on other sites More sharing options...
jeffman Posted January 12, 2011 Share Posted January 12, 2011 I've done some Googling in addition to the tests I ran earlier. It looks like Firefox and Opera really are the only browsers that support this. Everyone who's tested it says the same thing, and no one says different. Game over. Link to comment Share on other sites More sharing options...
Guest trlkly Posted April 4, 2011 Share Posted April 4, 2011 I've done some Googling in addition to the tests I ran earlier. It looks like Firefox and Opera really are the only browsers that support this. Everyone who's tested it says the same thing, and no one says different. Game over.You can do it in Chrome, too. You just have to use the iframe shim. It's how people on userscript.org get their favicon changing scripts to work on Chrome.That said, it's still game over if you want to maintain IE support, even if IE9 supports it. Link to comment Share on other sites More sharing options...
Zaper Gallis Posted April 5, 2011 Share Posted April 5, 2011 I'm not the greatest scripter yet, and i'm not in a place were i can test this, but is it possible to use Ajax to reload favicon link? or can ajax only be used in the body tag? Sorry if this isn't any help. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.