22

I have a <div id="content"> want to load url: http://vnexpress.net content into my code:

<html>
    <head>
        <script type="text/javascript">
            $(document).ready(function(){
                $("#content").attr("src","http://vnexpress.net");
            })
        </script>
    </head>
    <body>
        <div id="content"></div>
    </body>
</html>

I don't want to use Iframe

codingrose
  • 15,563
  • 11
  • 39
  • 58
vinanghinguyen
  • 1,233
  • 4
  • 11
  • 17
  • It seems vnexpress.net is not your domain so you need to use iframe – Esailija Dec 01 '11 at 01:05
  • 2
    "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." [link](http://api.jquery.com/load/) – Tahir Akhtar Oct 18 '12 at 02:34

5 Answers5

20

Try the load() function.

$('#content').load("http://vnexpress.net");

Please not that for this to work, the URL to be loaded must either be on the same domain as the page that's calling it, or enable cross-origin HTTP requests ("Cross-Origin Resource Sharing", short CORS) on the server. This involves sending an additional HTTP header, in its most basic form:

Access-Control-Allow-Origin:*

to allow requests from everywhere.

Community
  • 1
  • 1
Carsten
  • 17,991
  • 4
  • 48
  • 53
6
$(document).ready(function() {
 $('#content').load('your_url_here');
});
Sudhir Bastakoti
  • 99,167
  • 15
  • 158
  • 162
4

You need to use an iframe.

<html>
<head>
<script type="text/javascript">
    $(document).ready(function(){
    $("#content").attr("src","http://vnexpress.net");
})
</script>
</head>
<body>
<iframe id="content" src="about:blank"></iframe>
</body>
</html
circusbred
  • 1,240
  • 8
  • 8
2
<html>
<head>
<script type="text/javascript">
    $(document).ready(function(){
    $("#content").attr("src","http://vnexpress.net");
})
</script>
</head>
<body>
<iframe id="content"></div>
</body>
</html>
tmjam
  • 1,029
  • 2
  • 12
  • 25
0

Not using iframes puts you in a world of handling #document security issues with cross domain and links firing unexpected ways that was not intended for originally, do you really need bad Advertisements?

You can use jquery .load function to send the page to whatever html element you want to target, assuming your not getting this from another domain.

You can use javascript .innerHTML value to set and to rewrite the element with whatever you want, but if you add another file you might be writing against 2 documents in 1... like a in another

iframes are old, another way we can add "src" into the html alone without any use for javascript. But it's old, prehistoric, and just plain OLD! Frameset makes it worse because I can put #document in those to handle multiple html files. An Old way people created navigation menu's Long and before people had FLIP phones.

1.) Yes you will have to work in Javascript if you do NOT want to use an Iframe.

2.) There is a good hack in which you can set the domain to equal each other without having to set server stuff around. Means you will have to have edit capabilities of the documents.

3.) javascript window.document is limited to the iframe itself and can NOT go above the iframe if you want to grab something through the DOM itself. Because it treats it like a separate tab, it also defines it in another document object model.

k.i
  • 11