I'm trying to put a HTML code into a frame.
Out of frame I have used: document.write and into?
The frame is:
var frameTwitter = document.getElementById('FrameTwitter');
In order to write to an iFrame, you need to get its contentWindow or contentDocument.
var frameTwitter = document.getElementById('FrameTwitter'),
frameDocument = frameTwitter.contentWindow || frameTwitter.contentDocument;
frameDocument = frameDocument.document || frameDocument;
frameDocument.write('<p>Hello World!</p>');
DEMO: http://jsfiddle.net/NTICompass/8Ekrs/1/
UPDATE:
You can also use window.frames to get the iFrame's window object.
var frameDocument = window.frames.FrameTwitter.document;
frameDocument.write('<p>Hello World!</p>');
DEMO: http://jsfiddle.net/NTICompass/8Ekrs/2/
you have to use the postmessage API
see https://developer.mozilla.org/en-US/docs/DOM/window.postMessage
Rocket Hazmat is also correct
Normally, scripts on different pages are only allowed to access each other if and only if the pages which executed them are at locations with the same protocol (usually both http), port number (80 being the default for http), and host (modulo document.domain being set by both pages to the same value)
Since you're using 2 files that are on the same domain this should work. It's probably ideal to use a relative path on the iframe since you've got to match domains, protocols & ports or this will stop working.
MainPage.html
<iframe src="Frame.html" id="FrameTwitter"></iframe>
<script type="text/javascript">
var frame = document.getElementById('FrameTwitter');
frame.writeInto('Some text here');
</script>
Frame.html
<script type="text/javascript">
function writeInto(str) {
document.writeln(str);
}
</script>
That way you can set up the functionality you need for Frame.html within the file, test functionality there without worrying about cross-frame development yet. Then once your features are set up you can fire them from the parent.
Related
A method to define IP for hostname to be used when loading assets to avoid dns resolve.
example: set host.com ip = 1.2.3.4
<img src="http://host.com/img.png">
<img src="http://host.com/img2.png">
<script type="text/javascript" src="http://host.com/script.js">
I want "host.com" to resolve to "1.2.3.4" regardless the real ip in user browser DNS.
I know about "dns-prefetch", but is it possible to modify the address response?
like:
<link rel="dns-prefetch" href="http://host.com/" address="1.2.3.4">
I want to set it on website for visitors, something like load balancing.
You can't. Instead, either use a proper load balancer on host.com, or produce the images et. al. dynamically using a.host.com, b.host.com, c.host.com, etc.
You might do that dynamicness via the base element, which:
...allows authors to specify the document base URL for the purposes of parsing URLs, and the name of the default browsing context for the purposes of following hyperlinks.
So right at the top of your document, prior to any element that will have a URL to resolve, perhaps:
<script>
(function() {
var hosts = ["a.host.com", "b.host.com", "c.host.com"/*...or whatever their names are...*/];
var host = hosts[Math.floor(hosts.length * Math.random())];
var base = document.createElement("base");
base.href = "http://" + host + "/";
document.querySelector("head").appendChild(base);
})();
</script>
Then the links would be
<img src="img.png">
<img src="img2.png">
<script type="text/javascript" src="script.js">
Just beware that base affects all links in the document.
No. There is no address attribute on the link element in HTML.
Nor is that what the dns-prefetch link type meant to be used for. It is meant to tell the browser to do the DNS resolution of the domain name ahead of time. That is it.
There is also no method to tell the browser to do DNS resolution differently from a webpage that is loaded by the browser. That would be a fundamental breach of security.
I'm testing on this page, and I'm not sure what I'm missing.
// Two frames on the page
> document.getElementsByTagName("frame").length
2
// Same domain, so no security restrictions
> document.getElementsByTagName("frame")[0].src
"http://www.quackit.com/html/templates/frames/menu_1.html"
> window.location.href
"http://www.quackit.com/html/templates/frames/frames_example_1.html"
// Can't access the document
> document.getElementsByTagName("frame")[0].document
undefined
It seems like this should work, so what's the problem? It needs to work in IE8, but I'm also testing in Chrome (newest stable).
The all-around way to getting a frame's contents is with something like this:
var theFrame = document.getElementsByTagName("frame")[0];
var theFrameDocument = theFrame.contentDocument || theFrame.contentWindow.document;
var button = theFrameDocument.getElementById("mybutton");
However, it is possible to get a <frame>'s document by using its name, like:
window.frames["frame_name"].document
if the HTML were:
<frame name="frame_name">...</frame>
You could use
parent.frame.location.href = ...
Where frame is the name/id of the frame you d like to change.
Greets
Marc
I have an iframe on mynewwebsite.com showing content from mywebsite.com
alert(window.location.hostname);
always shows mywebsite.com, is there any way I could get the URL from the user's address bar without modifying anything on mynewwebsite.com?
I want to check the domain and load stylesheets accordingly.
Try something like this
var url = (window.location != window.parent.location) ? document.referrer: document.location;
I think window object refers to the current window -- the iframe's window object because you're calling it from the iframe.
Try
window.parent.location.hostname
But since they are two different domain names you will encounter a cross-site-scripting security (aka XSS) limitation. You have to configure your servers to allow XSS between the two domains.
Maybe this will help:
alert(window.parent.location.hostname);
alert(window.top.location.hostname);
It works in Chrome like a charm.
var URL = window.location.href;
Try
var myIframe = document.getElementById('yourIframeId');
alert(myIframe.contentWindow.location.hostname);
I'm trying to load a page as an iframe and then extract some information from it.
function calleniro(who, where, announcementID){
var url = 'https://personer.eniro.se/resultat/'+who+'/'+where;
var frameid=announcementID.substr(0,7)
var iframe=$('<iframe />', {
src: url,
id: frameid
}).appendTo('body');
iframe.load(function (){
var frame = $('#'+frameid).contents;
console.log(frame)
});
}
the console.log($(frameid)) renders the iframe-node as desierd, when I add content it seems to be not find anyting
var frame = $(frameid).contents().find('body');
doesn't work either.
Due to the Same origin policy you cannot interact with content outside of your domain.
If your only intent is to load the page to get values from it (i.e not actually display the IFrame) you could simply $.get() the Eniro url to get the raw HTML response and then parse it from there. I think that should be possible with jQuery, might require some tinkering though :)
Update
As has been pointed out, the same origin policy applies to my solution as well (learning something new every day!), however it should be perfectly possible to apply the solution at the server instead
Can anybody explain how the following javascript variables:
document.referrer
document.location.href
or the http REFERRER header, could come to be 'javascript:window["contents"]' ?
Not only do I not understand how they could be set to a javascript uri - but window.contents isn't a standard DOM attribute in any browser that I know of... (It is window["contents"], not window["content"])
I believe I found the solution to this..
There are some javascripts in the wild which seem to create iframes using code (something) like this:
var contents = '<html>......</html>';
var ifr = document.createElement('iframe');
ifr.contentWindow.open();
ifr.contentWindow.write(contents);
some particular combination of this sometimes ends up specifying either the href of the iframe , or the referrer, as "javascript:window['contents']" - i.e. the javascript variable which temporarily holds the page data.
(still not completely finalized on the details, but that's the basic idea)