html - Load external site's content

Question

I need to display another external site's content into my site. Normally <iFrame> tag can do it. But my requirement is not whole content, only part of that site. For example that site's layout has 3 parts, <div id="header">, <div id="sidebar">, <div id="content". I mean I want only display "id=content" part. How do I do it?

I tried $("$my-content").load("http://www.anothersite.com #load-content"), but not working.

Answer 1

This is due to ajax cross domain security restrictions, one trick is to setup a proxy script from the server that the downloads the contents from different site(domain) and use that proxy as your reference in javascript.

Example: (proxy.php)

<?php
    $url = 'http://www.anothersite.com';
    $htm = file_get_contents($url);
    echo $htm;
?>

Then on your script, instead of:

$("$my-content").load("http://www.anothersite.com #load-content");

use the proxy:

$("$my-content").load("proxy.php #load-content");