javascript - 跨嵌套子 div 复制表列结构

Question

因此，我正在使用一段代码，该代码基于数据结构自动生成嵌套的复选框结构。

下面，我简化了嵌套 div 结构的外观：

<div class="tree">
    <div class="item level1">
        <div class="content">
        </div>
        <div class="children>
            <div class="item level2">
                <div class="content">
                </div>
                <div class="children>
                    <div class="item level3">
                        <div class="content">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

所以，我想将数据片段添加到这些level3节点，但我希望这些数据片段以类似表格的方式格式化。

这是一张基本图：

注意：这些线条只是为了便于查看格式而绘制的，不需要在实际视图中。

我希望所有值 1 的值排列成列，这样每个“单元格”都具有列中最长 div 的长度，以便它们轻松格式化并且用户可以向下扫描列表。

content在div节点中保存这些数据，level3同时正确格式化它们的最佳方法是什么？我曾想过尝试div使用某个类计算每个类的正确宽度并使用 JavaScript 手动设置宽度，但我不确定如何获取“正确”宽度以便调整所有divs. 这也很重要，因为我们可以更改这些值。因此，如果一个值发生变化，我将不得不重新计算宽度。

提前致谢！

标签： javascripthtmlcss