The <browser> element displays online content
and provides full browsing capabilities to your application, such as
navigation features or maintaining a history.
<browser id="content" type="content-primary" src="ch3.html"/>
The behind-the-scenes implementation for browser
gives you access to certain interfaces that can be used in your
scripts. These interfaces include:
Without going into detail, these interfaces all provide sophisticated
functionality for web browsing and other browser-like services, and
are made available to JavaScript in the application interface. You
can explore them further by looking at the interfaces
themselves -- at the IDL files of the same name in the Mozilla
source tree.
 | If you would like to learn more about these available interfaces, the
best place to look is the source code. The two recommended files to
start with are browser.xml, which shows how the
interfaces are exposed, and navigator.js, which
shows how they are used. Both files can be browsed on the online
Mozilla Cross Reference, at http://lxr.mozilla.org.
|
An alternative to <browser> is the
<iframe>. It's similar to the
browser widget in appearance, but better suited for simple or
ephemeral content. It's often used as a preview
window in HTML/XML editors and other WYSIWYG applications. iframes
can also be good for dynamic document editing, as in the following
example, in which the frame provides access to the document loaded as
content. This can then be written to:
<iframe id="simple-content" />
The document's open( ),
write( ), and close( ) methods,
which are standard in the JavaScript engine, are used to write to the
document:
var doc = window.frames[1].document;
doc.open( );
doc.write("<html><body>Come fly with me ...</body></html>");
doc.close( );
In this code snippet, you get a handle to the particular frame that
you want by using window.frames, which returns an
array of all frames contained in a document. There can be multiple
frames in a document, which are indexed. Here it is assumed that we
get the second (1 in a zero-based array) frame. The
doc variable has a reference to the content area
and uses the methods available on the document
object to write content -- in this case, HTML.
Ideas for using content panels include:[1]
Create HTML or XML help pages for your application and upload them in
a ready-made help browser.
Create a previewer: test your XML, HTML, or CSS layout and styling in
Gecko -- one of the most standards-compliant layout engines
around.
A slight variation of the previous use, you could use mini-versions
inline in dialogs to load up examples that change depending on the
selection of the user from a number of choices (a font previewer, for
example).
Pop ups contained in a window for display of web content.