Rendering markdown at a specific position with dataviewjs

Share & showcase
1

Hello, I would like to share an undocumented trick to render markdown at a specific position with dataviewjs.

Pursuant to the official documentation, the functions dv.paragraph and dv.span only accept one parameter, i.e. the markdown text to be rendered. By default, it is rendered at the current possition in the dataview container, i.e. at the end of it.

There is however an undocumented argument which allows to pass a HTML element to specify the position where the markdown must be rendered. An an argument, you need to pass an object whose property container is the HTML element. For instance:

let a = dv.paragraph("This is a **first** paragraph")
let b = dv.paragraph("This is a **second** paragraph")
a.innerHTML = ""
dv.paragraph("This is a **third** paragraph", {container: a})

I hope this can be of use to others!

2 Likes
2

It sure seems like dv.header(), dv.paragraph(), dv.span() and possibly dv.el() can accept this kind of options. I didn’t know that, and I’m kind of uncertain how much we should document this, as this could potentially change the rendering at “random” places in the DOM.

So if one opts to use this as it is currently allowed to do so, use at it your own risk as an undocumented feature that might be removed in a future update of Dataview as this can really mess with the rendering of other elements outside of the code block that’s triggering the changes.