Load a external URL into a div using jQuery

Question

I want to load a whole site into a div. When I use

$(document).ready(function(){
        $('#result').load('http://www.yahoo.com');
    });

It's not working.

If you read through the jQuery documentation for load you will find the following: Additional Notes: Due to browser security restrictions, most "Ajax" requests are subject to the same origin policy; the request can not successfully retrieve data from a different domain, subdomain, or protocol. — Lazarus
– Lazarus, Commented Jun 23, 2011 at 12:20

Teja Kantamneni · Accepted Answer · 2011-06-23 12:19:43Z

3

It will be a cross domain call to do using javascript. You can use iframe to load. Check this link for possible solutions.

answered Jun 23, 2011 at 12:19

Teja Kantamneni

17.5k12 gold badges58 silver badges86 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Variant · Accepted Answer · 2011-06-23 12:20:01Z

1

This is a cross-domain issue.
You can create a proxy on your server to fetch the data and you'll load it from your own domain.

answered Jun 23, 2011 at 12:20

Variant

17.4k4 gold badges44 silver badges67 bronze badges

Comments

Orbling · Accepted Answer · 2011-06-23 12:20:30Z

1

What do you mean "a whole site", if you mean a given page, then it'll probably require all manner of header included files, which are not suitable to go in to the body of your page.

You would need to use an IFRAME, just create the IFRAME element and set the source to the URL you want.

answered Jun 23, 2011 at 12:20

Orbling

20.7k4 gold badges56 silver badges64 bronze badges

Comments

Jura Khrapunov · Accepted Answer · 2011-06-23 12:21:25Z

1

Although I'm not sure about your use case of loading "whole" site into div - you are limited by "same domain" security policy, in order to make cross-domain AJAX calls you need to employ JSONP call http://api.jquery.com/jQuery.getJSON/

answered Jun 23, 2011 at 12:21

Jura Khrapunov

1,0246 silver badges15 bronze badges

Comments

Town · Accepted Answer · 2011-06-23 12:29:04Z

1

You can't do that unless the content you're loading comes from the same domain as the site you're loading it into, due to JavaScript's Same Origin Policy.

Your alternatives:

load the content into an iframe
pull the content server-side via an HTTP get, and the write it out to your page

Beware of licensing issues with the second option if you don't have permission to use the content, though!

edited Jun 23, 2011 at 12:29

answered Jun 23, 2011 at 12:21

Town

14.9k3 gold badges50 silver badges72 bronze badges

Collectives™ on Stack Overflow

Load a external URL into a div using jQuery

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related