javascript - 更改可见性后不显示元素

Question

我试图在点击时显示框，但没有显示任何内容。我可以在控制台中看到可见性已更改，但该框仍然不存在。如果我将可见性设置为内联，那么我可以看到该元素。你能告诉我我做错了什么吗？查看器是来自 PDFTron 的 iFrame

<div>
     <div id='viewer'></div>
     <meta name="viewport" content="width=device-width, initial-scale=1">
    </div>
    <div id="pindialog" 
     style="display:none; width=10000px; height=10000px; position:absolute;top:80px; color:blue"> 
    </div>

    <div>
    <script>
      function displayPinDialog() {
        var pinDialog = document.getElementById("pindialog");
    
        if (pinDialog !== null) {
          pinDialog.style.color = "blue";
          pinDialog.style.display = "block";
        
        }
      }
    
      document.addEventListener('DOMContentLoaded', () => 
      { 
        const viewerElement = document.getElementById('viewer');
    
         WebViewer({
          path: 'lib/webviewer',
          initialDoc: 'lib/webviewer/simple.pdf', // replace with your own PDF file
        }, viewerElement).
        then(instance => {
              instance.setTheme('dark');
              instance.disableElements(['downloadButton','printButton' ]);
  
          return instance
        })
        
        .then(instance => {
        instance.setHeaderItems(header => {
          header.push({
            type: 'actionButton',
            label: 'test',
            onClick: () => {
              // save the annotations
            }
          });
        });
        instance.setHeaderItems(header => {
          header.push({
            type: 'actionButton',
            label: 'test0',
            onClick: () => 
            {  
              displayPinDialog();
            }
          });
        })
      
        instance.setHeaderItems(header => {
          header.delete(9);
          header.unshift({
            type: 'customElement',
            render: () => {
              const logo = document.createElement('img');
              logo.src = 'HomeLogo.svg';
              logo.style.width = '45px';
              logo.style.marginLeft = '10px';
              logo.style.cursor = 'pointer';
              logo.onclick = () => {
                window.open('https://www.google.com', '_blank');
              }
              return logo;
            }
          }, {
            type: 'spacer'
          });
        });
      });
      });
     
    </script>

标签： javascript