How to convert element nested children to Multi-dimensional associative arrays in javascript?

Question

This is my menu layout in html

<ul>
    <li>1
        <ul>
            <li>1-1</li>
            <li>1-2</li>
        </ul>
    </li>
    <li>2</li>
    <li>3
        <ul>
            <li>3-1
                <ul>
                    <li>3-1-1</li>
                    <li>3-1-2</li>
                </ul>
            </li>
            <li>3-2</li>
        </ul>
    </li>
    <li>4</li>
    <li>5</li>
</ul>

How to convert this layout to Multi-dimensional associative JS array and keep items values ?

You need to programmically convert this? Or is this a one-time conversion? — Kevin Seifert, Aug 28 '15 at 14:39

score 2 · Answer 1 · edited May 23 '17 at 11:52

2

To do this with a custom function, first you'd need code that gets the top ul, and iterates through all children. I wrote some sample code for this here, if it's useful:

getElementById doesn't work on a node

Then, when building a data structure, use these rules:

1. ul maps to a []
2. li maps to { "text value of li": children }
3. if there are no children, children is null

edited May 23 '17 at 11:52

Community

1
1

answered Aug 28 '15 at 14:50

Kevin Seifert

3,494
1
18
14

How to convert element nested children to Multi-dimensional associative arrays in javascript?

1 Answers1