Sharing HTML between topics - basic method

Topic status automatically displays here - do not remove.

Bookmark me! Bookmark this topic Print me! Print this topic

The ability to share HTML content between topics without duplication allows for an effective single source location for the content, and for it to be shared and used in multiple locations by multiple HTML documents.

The trick is to use a hidden inline frame element (iframe) on the destination page to retrieve the source topic, then use script to extract the relevant section out of the framed document and display it where required.

To share HTML between topics

On the destination page, insert a hidden iframe element out of the way, like at the very bottom (just before the closing HTML tag), name it for identification, provide the source file name, and size it to nothing:
```
<iframe class="hidden" id="iframeDuplicator" src="SourceFileName.htm" 
style="width: 0px; height: 0px"></iframe>
```

On the same page, in the header, insert the script necessary to perform the duplication work:

<script type="text/javascript">
 function DuplicateText()
 { // copies the text where required to prevent source duplication
  Destination.innerHTML = document.frames("iFrameDuplicator").Source.innerHTML; } 
</script>

Still on the same page, insert the onload command to the Body section:
```
<body onload="DuplicateText();">
```
Now comes the tricky part. You will need to insert divisions in both the source file—wrapping the source section, and in the destination file—where you want the source to display. You then need to identify these divisions accordingly, so that the script can locate and use them. In this example, I used "Source" and "Destination" (see, I told you it was tricky!)
On the source page:
```
<div id="Source">This is the source text which gets duplicated</div>
```
Back on the destination page again:
```
<div id="Destination">Duplicate text goes here</div>
```

The section being duplicated can be as long or short as is required, and containing HTML tags. If inline text is all that is being duplicated, and not HTML elements, you could use span tags instead of divisions.

You will need to create a separate iframe for each separate topic you wish to access data from. Of course, in this circumstance, each iframe will require its own individual name, and the script will require an appropriate separate command line for each copy function.

I imagine the only limit to the number of iframe objects on the page will be the download time during initial loading. Once downloaded, you should be able to extract and use whatever you've previously labelled at will.

Alternatively, if you wish to use more than one document as the source, reusing the same iframe for each document, you can use scripting to dynamically load, use, then unload any document at will. See Jump across to separate topic advanced method.

Sharing HTML between topics - basic method

See Also