defer attribute in the script tag inside the hbs file

Question

I am writing code in java script using express. I have a index.hbs file which is simular to the html file. I try to write the code inside the script tag

<div class="container" style="display: flex; 
  flex-direction:column;
  align-items: center;
  justify-content: center; 
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;">
  <h1 style="color:pink">{{title}}</h1>
  <p style="color:tomato">Welcome to {{title}}</p>
  <div style="display: flex;
  align-items: center;
  justify-content: center">
    <form method="post" action="/urls">
      <label for="long">Enter the URL to Shorten</label>
      <br>
      <br>
      <input style="width: 400px" id="long" name="LongURL" placeholder="longUrl" />
      <input type="submit" value="Отправить">
    </form>
  </div>
  <h1 style="color:pink">Shortened URL's</h1>
  <ul>
    {{#each db}}
    <li style="width:100%">
      <p>{{this.longId}}</p>
      <a href="{{this.longId}}" target="_blank">
        <p>{{this.shortId}}</p>
      </a>
      <p>Number Visited: {{this.numberUsed}}</p>
    </li>
    {{/each}}
  </ul>
</div>

to find the element with a tag a. I can write

<script>
  console.log(document.querySelector("a"));
</script>

at the end of the html file, but I want to do it with defer. If I write this attribute in the script tag before the html code inside index.hbs It returns me empty value. How can I do it?

Answer 1

// Try this way 
window.onload = function (){
    console.log(document.querySelector('a'))
}