<html>
<td id="test" onload="GetValue('{{name}}')"></td>
</html>
<script>
function GetValue(value){
value+="Hello";
document.getElementById("test").innerText=value;
}
</script>
The goal is to have table row as "JohnHello" directly on page load. I am using Handlebars and let's suppose "John" has been passed on the {{name}} variable.
The load event is fired for the window... And some other elements like <img>... But not on a <td>.
In the below snippet, I used the onload attribute on the <body>. That is because it directly belongs to window. You can target it using window.document.body.
Additionnaly, I would suggest you to test using valid HTML. So to have a <td> inside a <tr> and a <table>... And the <script> tag inside the <body>.
That will spare you time for sure.
<html>
<body onload="GetValue('john')">
<table>
<tr>
<td id="test"></td>
</tr>
</table>
<script>
function GetValue(value) {
value += "Hello";
document.getElementById("test").innerText = value;
}
// This log is to show that <body> directly belongs to window
console.log(window.document.body)
</script>
</body>
</html>