KargJonas/inst.md

## inst.md

      
    Raw
  

              inst.md
            
          
    This is all that is needed:

function inst() {
	Array.from(document.getElementsByTagName("comp")).map(element => {
		if (!element.hasAttributes()) return;
		const func = element.attributes[0].name;
		if (!/\w\(.*\)/.test(func)) return;
		element.innerHTML = eval(func);
	});
}

window.addEventListener("load", inst);
It allows you to insert the returned values of functions directly into HTML.

An example:

<body>
    <comp test([0,1,2,3])></comp>
    <comp test(["Marcus","Lucas","Ben"])></comp>
	
    <script>
        function test(numbers) {
            return numbers.map(
                num => `<h1>${num}</h1>`
            ).join("");
        }
    </script>
    <script src="inst.js"></script>
</body>
When inst() is called every component is "rendered". Components can be renderd as often as you want.

This has many disadvantages - for example that any arguments passed into the component are lowercase or that you won't get an output if you have spaces in the function argument. But it's still kindof cool and potentially useful.
No results found