How to get favicon icon/ Apple-touch icon and title of a web page using Javascript or Jquery?

Question

I can insert a whole web page in a div or an IFrame as:

<iframe src="http://www.stackoverflow.com" id="iframe" scrolling="no"></iframe>

But I need only icon and title for Iframe.

I have no idea how to get only these items favicon icon / Apple-touch-icon and title of a website.

e.g. www.stackoverflow.com, I need only its title and favicon icon/Apple-touch-icon. Is there any plugin or any parser that can parse the HTML of a web page and return these? Any help is appreciated.

Answer 1

See "How can I get the title of a webpage given the url (an external url) using JQuery/JS" for getting the title. A similar technique should extract the favicon -- just look for <link rel="shortcut-icon"> instead of looking for <title>.

Note though that you're potentially going to run into cross-site scripting issues. See "How can I access iFrame elements with Javascript?" and "How to expose IFrame's DOM using jQuery?" for an iframe approach.