Question

我正在使用Electron Js版本2。每次我运行下面的html页面时，文本开始重叠，而向下移动。 appendNewMessage（'添加新文本'）; 在定时循环中触发，该循环将文本添加和附加到 <div id='displaytext'></div> ，但是**<div id="belowtext">Text 2</div>**开始重叠< strong> <div id='displaytext'></div> 变得一团糟。我不确定如何解决此问题。它似乎可以在chrome浏览器中正常运行，而不能在ElectronJs中运行。如有任何建议，我将不胜感激，并先谢谢您。

    <!DOCTYPE html>
    <html>
      <head>
        <meta charset="UTF-8">
        <title>Hello World</title>

        <script>if (typeof module === 'object') {window.module = module; module = undefined;}</script>
        <script src="jquery-3.3.1.min.js"></script><!-- jQuery -->
        <script>if (window.module) module = window.module;</script>

      </head>
      <body>

     <h1>Hello World!</h1>
     <div id="displaytext"></div> <!--display text inside-->
     <div id="belowtext">Text 2</div> <!--then should move this below-->

    <script>
    const container = document.getElementById('displaytext');
    function appendNewMessage(msg = '') {
      const div = document.createElement('div');
      div.innerHTML = msg;
      container.appendChild(div);
    }

    ///loop to add text into <div id="displaytext"></div> 

    window.setInterval(function(){ 
      appendNewMessage('add new text');
    }, 10000);
    </script>


      </body>
    </html>

重绘问题文字重叠不向下移动

0 个答案: