Russell Bateman April 2024 last update:
Here is an example of a file completely in markdown (but could be just a section) that gets displayed in HTML. This is from fhircontext-controller.html which I wrote in markdown (Cursor AI collaboration). Highlighted is the actual HTML content of that file while the rest is markdown. As already noted, the markdown could just be a tiny section of otherwise mostly HTML content in the file.
<div id="content"> # Parser Configuration vs `FhirContext` Configuration ## Question Can parser settings like "override resource IDs with bundle entry full URLs" be configured on `FhirContext`, or is this entirely a parser-level concern? ... A `FhirContext` controller could provide consistent defaults across all processors, while still allowing individual processors to override `ParserOptions` when needed. </div> <script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/1.4.0/showdown.min.js"></script> <script> var conv = new showdown.Converter(); var text = document.getElementById( 'content' ).innerHTML; console.log( text ); document.getElementById( 'content' ).innerHTML = conv.makeHtml( text ); </script>
How does it work?
The <div id="content"> is the start of the markdown region (what will be displayed), which is closed by the matching </div> element.
HTML is warned of a script on the URL path, graciously offered by https://cdnjs.cloudflare.com.
A second script tells (JavaScript) how to excerpt the markdown content, get it translated into HTML (by the CloudFlare script), then injected into the (otherwise) HTML content by the browser.
Nothing of the JavaScript code will be displayed; it's only to instruct the browser what to display and by what means. However, as already pointed out, the document could include HTML content and the markdown would/could be interspersed throughout that HTML content if desired.
Example of doing a table in markdown that clicking on will jump to another part of the markdown document in viewers so equipped. Note, in the example below, that there are two space characters at the end of each index line (but not at the end of the "Table of Contents" line). For each "destination" tag, there must not be balanced '#', but only a single '#' before the label ("Allergy", "Encounter", etc.).
### Table of Contents ### [Allergy](#Allergy) [Encounter](#Encounter) [FunctionalStatus](#FunctionalStatus) [Immunization](#Immunization) [Medication](#Medication) [Payer](#Payer) [Problem](#Problem) [Procedure](#Procedure) [Result](#Result) [SocialHistories](#SocialHistories) [VitalSign](#VitalSign) ## Introduction ## Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. # Allergy This is an allergy... Qui iste voluptatem ea cum. Praesentium asperiores molestiae sit velit enim consequatur debitis molestiae. Quibusdam quo sed odio occaecati est laborum. Blanditiis eligendi culpa incidunt temporibus sequi. Commodi quidem dignissimos labore. Dignissimos velit voluptas et velit rem. Cupiditate aliquam beatae perspiciatis. Quo veritatis nesciunt cumque. Nobis odio et omnis quia quia aut rem deleniti. Labore nesciunt voluptates quo esse. Sapiente similique incidunt ab quasi vero delectus quia architecto. Magnam natus amet harum quam voluptatum non amet. Iusto et rerum consequatur vero voluptatum magnam molestiae ut. Harum cupiditate ut excepturi aliquid molestias eligendi. # Encounter etc....