[jquery] How can I load webpage content into a div on page load?

Without using iframes, is it possible to load the contents of

<div id="siteloader"></div>

With an external site e.g. somesitehere.com

When the page loads? - I know how to load contents from a file, but wasn't sure how to load a whole site?

Many thanks,

This question is related to jquery ajax

The answer is


Take a look into jQuery's .load() function:

<script>
    $(function(){
        $('#siteloader').load('http://www.somesitehere.com');
    });
</script>

However, this only works on the same domain of the JS file.


With jQuery, it is possible, however not using ajax.

function LoadPage(){
  $.get('http://a_site.com/a_page.html', function(data) {
    $('#siteloader').html(data);
  });
}

And then place onload="LoadPage()" in the body tag.

Although if you follow this route, a php version might be better:

echo htmlspecialchars(file_get_contents("some URL"));

You can't inject content from another site (domain) using AJAX. The reason an iFrame is suited for these kinds of things is that you can specify the source to be from another domain.