Snippet Name: Copy IFRAME contents
Description: NN6 has powerful DOM operations to copy elements and nodes, named
"nodeObject.cloneNode(true)"
which creates a deep copy of the node. It is also possible to clone a
node from a document in one window/frame and to insert the cloned node
into another frame or window's document.
IE5+ also provides cloneNode but for our task to copy elements or nodes from frame to frame it doesn't help as IE5 and IE5.5 don't allow you to insert the node created in one window/frame document into another
window or frame's document. But as IE4+ has innerHTML and outerHTML properties for elements and the powerful insertAdjacentHTML so that we can use cloneNode and other DOM operations for NN6 and the HTML operations for IE4.
Comment: (none)
Language: JAVASCRIPT
Highlight Mode: JAVASCRIPT
Last Modified: February 27th, 2009
|
<HTML>
<HEAD>
<TITLE>
copying elements between frames
</TITLE>
<SCRIPT>
FUNCTION loadFrame () {
VAR html = '';
html = '<HTML><BODY>';
html += '<TABLE ID="aTable" BORDER="1">';
FOR (VAR r = 0; r < 3; r++) {
html += '<TR>';
FOR (VAR c = 0; c < 5; c++)
html += '<TD>' + r + ', ' + c + ' Kibology<\/TD>';
html += '<\/TR>';
}
html += '<\/TABLE>';
html += '<\/HTML>';
WITH (window.iframe0.document) {
OPEN();
WRITE(html);
CLOSE();
}
}
FUNCTION copyTable() {
IF (document.all)
window.iframe1.document.body.insertAdjacentHTML('beforeEnd',
window.iframe0.document.all.aTable.outerHTML);
ELSE IF (document.getElementById && document.body.cloneNode) {
VAR table = window.iframe0.document.getElementById('aTable');
VAR tableCopy = table.cloneNode(TRUE);
window.iframe1.document.body.appendChild(tableCopy);
}
}
</SCRIPT>
</HEAD>
<BODY ONLOAD="loadFrame()">
<INPUT TYPE="button" VALUE="copy table"
ONCLICK="copyTable();"
>
<BR>
<IFRAME NAME="iframe0"
SRC="about:blank"
WIDTH="400" HEIGHT="150"
>
</IFRAME>
<BR>
<IFRAME NAME="iframe1" SRC="about:blank"
WIDTH="400" HEIGHT="150"
></IFRAME>
</BODY>
</HTML> |
