[Webinar] Learn how to a build a cloud-first strategyRegister Now

  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 887
  • Last Modified:

How to embed IE in an HTML page


I know this may sound odd, but I would like to embed an IE object within an HTML page, similar to how you might embed an Excel file in an HTML page.  I would then like to write the appropriate HTML to that IE object. The idea is to have a page within a page, without using IFRAMEs or FRAMEs, so that all of the HTML is in the same file.

I am currently trying this:

  function write_IE() {
      return myie.write("Hello");

  width   =  800
  height  =  400
  id      = 'myie'
  classid = 'CLSID:8856F961-340A-11D0-A96B-00C04FD705A2'>

<form >
  <input type=submit onclick='return write_IE()' value='Hello'>

The classid is CLSID_WebBrowser. I have also tried classid = 'CLSID:0002DF01-0000-0000-C000-000000000046' which is  CLSID_InternetExplorer.  Neither seems to work, but the latter makes the status line say that it is still loading... forever.

I have also tried myie.outterHTML and myie.innerHTML.  The only interesting thing is that the innerHTML causes an error that onerror catches.  That's progress... but I still don't know why the embedded object isn't showing.

Note that in this example, I am using the form to do the writing. Ultimately, I will load directly, preferably with a PARAM tag, if possible.

Answers, anyone?


  • 4
  • 3
1 Solution
> The idea is to have a page within a page, without using IFRAMEs or FRAMEs, so that all of the HTML is in the same file.
There is no need to embed anything.
If you want independent scrollbars, then use a block container with explicit width/height and use "overflow:auto" or  "overflow:scroll".

<div style="height:200px; width:100px; overflow:auto">
your content goes here
Hi Joe.
A tricky thing indeed and I don't really see the point of embedding IE as an object. I can see a lot of reasons why this would not work. First of all, your method describes something that happens on the client side, not the server side. Since you have no control whatsoever over the clients computer, you might run into trouble. Imo it is better to include one page in another on the server side. What if the user doesn't run windows, for example? ...or are having another version of IE installed? I guess I don't fully understand why you want to use this method.

>> The idea is to have a page within a page, without using IFRAMEs or FRAMEs, so that all of the HTML is in the same file.

If this is your reasons, let me provide you with a couple of work-arounds:

1. Use server side includes (SSI). In ASP or PHP you can include one file in another. Since everything happens on the server, the output HTML will be like one page. This is a good method if you want to include a full document. More about SSI: http://www.w3schools.com/asp/asp_incfiles.asp

2. Use objXMLHTTP. This method is good if you only want the output HTML from another file. The file could be another webpage and it does not have to be on the same server as the container file. More info here: http://www.4guysfromrolla.com/webtech/110100-1.shtml

The two above methods happens on the server. That means your visitor are all getting the same output regardless what software or computer they use. Using your suggested method would be the opposite - if we ever can get it to work. Anyway, I would be happy to help you out with this. But you have to explain a little more what you want to accomplish.

jandrieuAuthor Commented:
Thanks, John. However, I am looking to do this on the client side.  The goal is to have a separate namespace, javascript environment, and style cascades for the embedded HTML. In other words, the embedded HTML needs to be able to specify its own <HEAD>, <STYLE>, and <SCRIPT> elements. The DIV that was suggested, SSIs, and the output from MSXML using objXMLHTTP all place the HTML in the same container.  Which means if I have lots of embedded HTML from different authors & sources, I'll potentially be combining a bunch of unknown namespaces, stylesheets, and javascript.

A separate embedded IE for each source would isolate them into groups where their own javascript/styles/etc. can be anything they want without messing up other embedded content on the same page.

Unfortunately, there does seem to be a security violation with the method of embedding IE.  I was able to embed IE using a "Location" parameter to load a particular URL, but I couldn't then write to the embedded object.

I have figured out a way to do it with IFRAMEs since posting the question, but I'm still hoping someone can find a way to load up an embedded IE with static HTML content from the "parent" web page, as I'm not yet convinced the IFRAMEs will maintain its own namespace, although it looks like it does so far.  I could do it if I were willing to create separate files for the embedded content (just using the "Location" parameter), but I don't think that's the right option. However, it might be worth it to get the embedded IE.


Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

An iframe IS an embedded browser instance.

If you want all your code inside one single html file, then you can place your "embedded" pages inside some html element or comment, then use DOM+javascript to read the code and write that to the iframe.
You'll need to encode all the html entities in the "embedded" pages and then decode them using javascript before you write it to the iframe.
jandrieuAuthor Commented:
By encoding, I'm assuming you mean that I'll have to handle the quotes and related content correctly.

For example, here is what is almost working:
            function decode(msg)
                  return msg;
            <iframe name='myie' src='about:blank'
onload='myie.document.write(decode("<div contentEditable=true>praise</div><a href=http://www.cbs.com>bob</a>"))'></iframe>
            <iframe name='myie2' src='about:blank'
onload='myie2.document.write(decode("<HTML><body>embedded <strong>also</strong></body></html>"))'></iframe>

However, as you point out, the "embedded" content won't handle quotes very well, and possibly other problems.

What do I have to do to properly encode/decode the embedded HTML so that it can be sent as a string var to the write method?

That's not a very orthodox method in the first place.
Using separate files for the content of your iframes is much better.

I guess you should at least encode all "<", all ">" and all quotes, so your code will be treated as plain text.
Javascript has methods for encoding/decoding into url format: escape() and unescape().
The php equivalent is urlencode() and urldecode().

If you choose to use this method, you should know that the result won't be "accessible" since it relies on javascript.
Search engines won't be able to read your iframes' content.
So, don't use that method for a public site.
jandrieuAuthor Commented:
Ok.  I'll look into encoding the embedded stuff. Unescape works fine with simple results, letting me put quotes around attributes in the embedded HTML.

Good point about the search engines.  Since the initial app is all client-side, this won't be critical. However, I'll have to remember if/when putting it on a server.  The main thing with the separate files is that I don't want users to have obvious access to the embedded content.

Thanks for the answer.
cheers  :)

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

  • 4
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now