Mam nietypowy problem do rozwiązania, nad którym siedzę parę godzin i nie mogę niczego wymyśleć. Chciałbym za pomocą JS wygenerować listę uporządkowaną, ale posiadając jedynie wiedzę o jej kolejności elementów oraz poziomów ich zagnieżdżeń. Aktualnie moja aplikacja tworzy następujący model DOM, gdzie data-indentation to poziom zagnieżdżenia, a data-position to numer pozycji:
<ol data-indentation="0" data-position="0"><li></li></ol>
<ol data-indentation="1" data-position="0"><li></li></ol>
<ol data-indentation="2" data-position="0"><li></li></ol>
<ol data-indentation="2" data-position="1"><li></li></ol>
<ol data-indentation="2" data-position="2"><li></li></ol>
<ol data-indentation="1" data-position="1"><li></li></ol>
<ol data-indentation="2" data-position="0"><li></li></ol>
<ol data-indentation="2" data-position="1"><li></li></ol>
<ol data-indentation="2" data-position="2"><li></li></ol>
<ol data-indentation="1" data-position="2"><li></li></ol>
<ol data-indentation="2" data-position="0"><li></li></ol>
<ol data-indentation="2" data-position="1"><li></li></ol>
<ol data-indentation="2" data-position="2"><li></li></ol>
<ol data-indentation="1" data-position="3"><li></li></ol>
<ol data-indentation="2" data-position="0"><li></li></ol>
<ol data-indentation="2" data-position="1"><li></li></ol>
<ol data-indentation="2" data-position="2"><li></li></ol>
<ol data-indentation="0" data-position="1"><li></li></ol>
<ol data-indentation="1" data-position="0"><li></li></ol>
<ol data-indentation="2" data-position="0"><li></li></ol>
<ol data-indentation="2" data-position="1"><li></li></ol>
<ol data-indentation="2" data-position="2"><li></li></ol>
<ol data-indentation="1" data-position="1"><li></li></ol>
<ol data-indentation="2" data-position="0"><li></li></ol>
<ol data-indentation="2" data-position="1"><li></li></ol>
<ol data-indentation="2" data-position="2"><li></li></ol>
<ol data-indentation="1" data-position="2"><li></li></ol>
<ol data-indentation="2" data-position="0"><li></li></ol>
<ol data-indentation="2" data-position="1"><li></li></ol>
<ol data-indentation="2" data-position="2"><li></li></ol>
<ol data-indentation="1" data-position="3"><li></li></ol>
<ol data-indentation="2" data-position="0"><li></li></ol>
<ol data-indentation="2" data-position="1"><li></li></ol>
<ol data-indentation="2" data-position="2"><li></li></ol>
<ol data-indentation="0" data-position="1"><li></li></ol>
<ol data-indentation="0" data-position="2"><li></li></ol>
<ol data-indentation="2" data-position="0"><li></li></ol>
<ol data-indentation="2" data-position="1"><li></li></ol>
<ol data-indentation="2" data-position="2"><li></li></ol>
<ol data-indentation="1" data-position="1"><li></li></ol>
<ol data-indentation="2" data-position="0"><li></li></ol>
<ol data-indentation="2" data-position="1"><li></li></ol>
<ol data-indentation="2" data-position="2"><li></li></ol>
<ol data-indentation="1" data-position="2"><li></li></ol>
<ol data-indentation="2" data-position="0"><li></li></ol>
<ol data-indentation="2" data-position="1"><li></li></ol>
<ol data-indentation="2" data-position="2"><li></li></ol>
<ol data-indentation="1" data-position="3"><li></li></ol>
<ol data-indentation="2" data-position="0"><li></li></ol>
<ol data-indentation="2" data-position="1"><li></li></ol>
<ol data-indentation="2" data-position="2"><li></li></ol>
Pytanie brzmi jaką wykonać pętlę, aby zbudować drzewo wg poniższej formy:
<ol>
<li>1.
<ol>
<li>1.1.
<ol>
<li>1.1.1.</li>
<li>1.1.2.</li>
<li>1.1.3.</li>
</ol>
</li>
<li>1.2.
<ol>
<li>1.2.1.</li>
<li>1.2.2.</li>
<li>1.2.3.</li>
</ol>
</li>
<li>1.3.
<ol>
<li>1.3.1.</li>
<li>1.3.2.</li>
<li>1.3.3.</li>
</ol>
</li>
<li>1.4.
<ol>
<li>1.4.1.</li>
<li>1.4.2.</li>
<li>1.4.3.</li>
</ol>
</li>
</ol>
</li>
<li>2.
<ol>
<li>2.1.
<ol>
<li>2.1.1.</li>
<li>2.1.2.</li>
<li>2.1.3.</li>
</ol>
</li>
<li>2.2.
<ol>
<li>2.2.1.</li>
<li>2.2.2.</li>
<li>2.2.3.</li>
</ol>
</li>
<li>2.3.
<ol>
<li>2.3.1.</li>
<li>2.3.2.</li>
<li>2.3.3.</li>
</ol>
</li>
<li>2.4.
<ol>
<li>2.4.1.</li>
<li>2.4.2.</li>
<li>2.4.3.</li>
</ol>
</li>
</ol>
</li>
<li>3.
<ol>
<li>3.1.
<ol>
<li>3.1.1.</li>
<li>3.1.2.</li>
<li>3.1.3.</li>
</ol>
</li>
<li>3.2.
<ol>
<li>3.2.1.</li>
<li>3.2.2.</li>
<li>3.2.3.</li>
</ol>
</li>
<li>3.3.
<ol>
<li>3.3.1.</li>
<li>3.3.2.</li>
<li>3.3.3.</li>
</ol>
</li>
<li>3.4.
<ol>
<li>3.4.1.</li>
<li>3.4.2.</li>
<li>3.4.3.</li>
</ol>
</li>
</ol>
</li>
</ol>
Z góry dzięki za poświęcony wysiłek umysłowy.