微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

无法通过 JS 在 Golang HTML 模板中放置 HTML 元素

如何解决无法通过 JS 在 Golang HTML 模板中放置 HTML 元素

故事:我们正在使用 gotenberg 将 HTML 转换为 PDF。这是一个发票用例,因此很明显,项目列表可能会延伸一页。在这样的多页场景中,我希望每个页面都有一个页脚。

怎么了?在生成多页 pdf 时,内容(即项目列表)与固定页脚重叠。此外,页脚仅出现在第一页上,其余页面为空。

我尝试了什么?我尝试注入一些 JS 来动态计算项目的高度并操纵 DOM 以插入换行符和页脚。

代码

  <script>

    window.addEventListener('DOMContentLoaded',function () {
      
      const testElement = document.getElementById('tests');

      testElement.addEventListener('load',function () {
        console.log('sahil')
      })

      let nodesFragment = document.createDocumentFragment();
      //copy of the children in context
      const testItems = [...testElement.children];
      console.log(testItems);

      const divend = document.createElement('div');
      divend.className = 'footer-find'
      const breakHeight = 10;
      let heightCounter = 0;

      nodesFragment.appendChild(testElement.firstChild);

      for (let i=0; i < testItems.length; i++) {

        heightCounter += testItems[i].clientHeight;
        nodesFragment.appendChild(testItems[i]);
        
        if (heightCounter >= breakHeight) { 
// if height of elements is greater than the specified breakHeight put an element
          nodesFragment.appendChild(divend);
          heightCounter = 0;
        }

      }
      nodesFragment.appendChild(testElement.lastChild);

      testElement.replaceWith(nodesFragment,testElement);

      document.getElementsByClassName('invoice-datetime')[0].innerHTML = "heey";
    })

    window.removeEventListener("DOMContentLoaded",window)
</script>

这种方法显然失败了,因为模板本身不存在列表内容

解决方法吗?

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。