在Promise层内将元素追加到HTMLFragment的问题

问题描述

此处是javascript的新功能。

当前，我正在开发一个Web扩展程序，以列出所有窗口并包含选项卡。但是，使用这些API会产生意外的结果。生成包含信息的片段的代码如下，然后将片段附加到另一个html元素。

  browser.windows.getAll().then((windows) => {
    let frag = document.createDocumentFragment();
    for (let w of windows){
      let winName = document.createElement('p');
      frag.appendChild(winName);

      getAllTabsInWindow(w.id).then((tabs) =>{
          for (let tab of tabs) {
          let tabLink = document.createElement('a');

          tabLink.textContent = tab.title || tab.id;
          tabLink.setAttribute('href',tab.id);
          tabLink.classList.add('switch-tabs');

          frag.appendChild(tabLink);
      }
      });
    }
   }

生成的片段类似于控制台DocumentFragment(5) [ p,p,p ]中的数组。结构类似于5所示的[w0，w2，w4 ...]数组，同时w1，w3和制表符1、2、3，...被作为子节点包含。

首先，如何在控制台中检查片段中的5 p个元素？我可以通过扩展来检查子节点。

第二，该代码生成了一个带有子代的片段。我想知道这是否是由于promise的异步性质。如果可以的话，我该如何展平？（任何推荐的展平方法？）或者，我如何以有序的方式执行诺言的相同任务？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）