Javascript 无法读取null的属性“insertAdjacentHTML”

当我尝试向DOM呈现新作业时，会显示上面的错误。模板文本从myjob.js文件中的getJob函数中选择数据。当我从查询搜索中单击特定作业时，id选择起作用。当我执行相同的操作时，下面的元素不会显示在DOM中。为什么我选择的元素为空

JS代码：

    export const renderJob = job => {
  const markup = `

  <figure class="job__fig">
    <h1 class="job_role">${job.title}</h1> 
    <h1 class="company_name">${job.company}</h1>
      <h3 class="job_location">${job.location}</h3>
      <img src="${job.logo}" alt="${job.title}" class="job_img">
        <p class="job_description">${job.description}</p>
        <p class="job_URL">${job.redirectURL}</p>
        <p class="job_createdAt">${job.createdAt}</p>
  </figure> 
  
  `;
  elements.job.insertAdjacentHTML('afterbegin', markup);
};

HTML标记：

<div class="job">
    <!--
   <figure class="job__fig">
    <h1 class="job_role">Frontend Engineer</h1> 
    <h1 class="company_name">Amazon</h1>
      <h3 class="job_location">Remote</h3>
      <img src="${job.logo}" alt="${job.title}" class="job_img">
        <p class="job_description">Amazon is looking...</p>
        <p class="job_URL">https://www.linkedin.com/jobs/view/frontend-engineer-studios-applications-at-amazon-1987071787/?utm_campaign=google_jobs_apply&utm_source=google_jobs_apply&utm_medium=organic</p>
        <p class="job_createdAt">09/26/2020</p>
  </figure> 
-->                   
      
</div>

---

什么是元素？显然，它的job属性为null。它包含几个选定的DOM元素。其中一个元素是“job”div。我的意思是：显示如何创建元素以及如何设置elements.job。。。因为显然elements.job为空。但是，只要你不显示它的位置和设置方式，就没有人能帮助你。元素是什么？显然，它的job属性为null。它包含几个选定的DOM元素。其中一个元素是“job”div。我的意思是：显示如何创建元素以及如何设置elements.job。。。因为显然elements.job为空。但是，只要你不显示它是在哪里以及如何设置的，就没有人能帮助你。