I’m glad you have your solution!
In reality this is possible outside Node as well in languages rendered on the server before being sent to the client which if you know PHP (I do) is similar. A PHP file pre-renders, and you can bind POSTed data, or data sent through the HTTP query string to the markup.
If you loaded an HTML file you might get an HTML string of that files contents. You can parse that string into it’s own DOM. DOMParser was the best way to do this last time I researched myself for my own purposes. This allows you to traverse the files node tree and bind the data yourself. You could add your id’s through the file to make this easier, though if you know the the structure this might not be necessary.
You might consider giving the markup in these files id’s similar to the identifiers you would be passing to them in the template file yourself such as ‘#title’ or ‘#content’. Better yet, you should be using Data Attributes. A data attribute is a fancy term for a general attribute naming convention that allows developers to bind their own data to HTML markup. Rather than searching for ID’s in the DOM, you query these attributes:
A data attribute name pattern uses data as a prefix for your custom attribute name (
And so you can query your markup like so: