how about loading your page using IFRAME ? I was thinking if this is possible ..
Example, i have this iframe below.
<iframe id="iframe" width="1024" height="600" src=""></iframe>
I want the www.sample page to load inside this iframe by not simply add the URL into src attribute, instead I'll get the current page data using ajax and to load using IFRAME tag. I'm thinking about this because I have a big problem on IFRAME cache most of the time.
I also try this thing but, it does not work perfectly on my end.
<iframe id="iframe" width="1024" height="600" src="""></iframe>
random is change everytime i load this iframe.
I want to apply it on my responsive tool like on the image below. If you need an actual view click here.
Thanks guys if have some idea out there .
how about loading your page using IFRAME ? I was thinking if this is possible ..
Example, i have this iframe below.
<iframe id="iframe" width="1024" height="600" src="http://www.sample.com"></iframe>
I want the www.sample.com page to load inside this iframe by not simply add the URL into src attribute, instead I'll get the current page data using ajax and to load using IFRAME tag. I'm thinking about this because I have a big problem on IFRAME cache most of the time.
I also try this thing but, it does not work perfectly on my end.
<iframe id="iframe" width="1024" height="600" src="http://www.sample.com?random=1422841682605""></iframe>
random is change everytime i load this iframe.
I want to apply it on my responsive tool like on the image below. If you need an actual view click here.
Thanks guys if have some idea out there .
Share Improve this question edited Jul 6, 2017 at 3:28 Anthony Carbon asked Feb 2, 2015 at 1:34 Anthony CarbonAnthony Carbon 6181 gold badge6 silver badges18 bronze badges 2- 1 If www.sample.com is not the same domain as your page with the iframe, you can't just use AJAX. – sideroxylon Commented Feb 2, 2015 at 2:18
- Thanks sideroxylon..but is there a way to prevent iframe cahce? do you have any idea? – Anthony Carbon Commented Feb 2, 2015 at 2:53
4 Answers
Reset to default 6You can still use src but supply data URL like this:
src = 'data:text/html;charset=utf-8,' +
encodeURIComponent( // Escape for URL formatting
'<!DOCTYPE html>'+
'<html lang="en">'+
'<body><h1>Another document!</h1></body>'+
'</html>'
);
You can change the location of an iframe with Javascript with a few different methods.
var frame = document.getElementById("iframe");
frame.src = "http://www.sample.com";
frame.contentWindow.location = "http://www.sample.com";
frame.contentWindow.open("http://www.sample.com");
Of course, you must be very careful with iframes. If the iframe points to a foreign domain (ie: "Cross-Origin", ie: NOT the same domain on which the main web page is hosted) you will breach browser security policies and will throw errors if you try to manipulate / read many properties.
Also note that by changing an iframe element's src attribute, the iframe will automatically travel to the new location. However, if you use one of the other two methods I suggested, the src attribute of the iframe element will not change (even though the iframe's content points to a new location).
If you need to get the location of an iframe, you can try:
iframe.contentWindow.location.href;
Again, however, if the iframe is pointing to a site that is not hosted on the same domain, this will cause an error. To be safe, use try {} catch (e) {} blocks.
Make sure to use "http://" before the link, example:
<iframe src="http://www.google.com"></iframe>
If www.sample.com is on the same domain, you can just do this:
<div id = "targetDiv"></div>
<script>
$('document').ready(function() {
$('#targetDiv').load('www.sample.com');
});
</script>
Though, if it is the same domain, you'd probably use .load('/');