The subject of iframes can become a little complicated there is much to write about with them when it comes to more advanced topics involving hidden iframes, and security concerns when with things like click jacking that ca be preformed with iframes. So in this post I will be sticking to just the basics for now as many of these other topics are matters for another post.
When working with an iframe that is hard coded into the html the process is to just gain a reference to it by using something like document.querySelector, document.getElementById, or any other means that will result in the creation of a reference to the hard coded iFrame element in the html of the page.
Once a reference to the iFrame is obtained it is possible to access the window object of that iFrame via the contentWindow property of the iFrame element. This works in much the same way as the window object of the page itself as such I can add content to the iFrame in the same manner as I would with the main window object. So there is getting at the window object of an iframe that is all ready there in the html, but then there is creating and injecting them also, so with that said lets look at the next section.
With this kind of approach you might have some html like this.
Never the less if the url is at the same domain, or if it is a url where this sort of thing will happen without issue then the following might work out okay.
To do so I just need to set the src attribute of the iframe to the url of the resource that I want to load and display in the iframe. If all goes well that alone should work, if not finding a solution to this is outside the scope of this post.