руль JS BASIC Пример
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.7.7/handlebars.min.js" integrity="sha512-RNLkV3d+aLtfcpEyFG8jRbnWHxUqVZozacROI4J2F1sTaDqo1dPQYs01OMi1t1w9Y2FdbSCDSQ2ZVdAC8bzgAg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script id="introduction-template" type="text/x-handlebars-template">
<p>Hello, my name is {{name}}!</p>
</script>
<script>
// grab the source
const source = document.querySelector("#introduction-template").innerHTML;
// compile it using Handlebars
const template = Handlebars.compile(source);
// create context
const context = {
name: "Sabe"
};
// get the HTML after passing the template the context
const html = template(context);
// get the element to set the new HTML into
const destination = document.querySelector(".introduction");
// set the new HTML
destination.innerHTML = html;
</script>
KostasX