I'd like to start this question by saying that I'm very new to HTML and don't have any formal experience. My goal is to add a snippet of HTML code containing an interactive figure into another HTML document. I have figured out how to do this by using the <object> Tag. The only problem I'm facing is that data= field needs a URL to a separate file. I can't have a two HTML files, as I need to give my client a single HTML. Is there a way to create a new string containing the HTML code of the interactive figure -- then pass it to the data= field? Or something similar?

<object align="center" style="width:30%;height:500px" data="/Users/Desktop/plotly_test2.html"></object>

To reiterate: I was able to use <object> Tag to load the interactive figures into my HTML; however, I am looking for a way to supply the data= field with a string of the HTML, rather than a path to an HTML file.

<object align="center" style="width:30%;height:500px" data="/Users/Desktop/plotly_test2.html"></object>

CodePudding user response：

It is possible by encoding the inner HTML using the URL data scheme.

This is most often done with small images.

The URL becomes something like so:

... data="data:<HTML-base64-encoded>" ...

Of course, the prohibits easy editing, although you can write a script to convert your two HTML documents into one, automatically.

As a side note, in most cases people use <iframe ...> to include another HTML page, rather than <object ...>.