Convert nested <ul><li> to PHP nested array

Question

I want to convert nested ul li to a PHP array.

The HTML code that I have is something looks like:

<ul id="main-menu">
    <li id="firstNavItem"><a href="index.html">Home</li>
    <li><a href="Warp.html">Warp</a>
        <ul>
            <li><a href="Warp-how-it-works.html">How it works</a>
            </li>
            <li><a href="Warp-Engine.html">Warp Engine</a>
            </li>
            <li><a href="WarpFactors.html">Warp Factors</a>
            </li>
            <li><a href="">Fuel</a>
                <ul>
                    <li><a href="Anti-Matter.html">Anti-Matter</a>
                    </li>
                    <li><a href="Deuterium.html">Deuterium</a>
                    </li>
                </ul>
            </li>
        </ul>
    </li>
    <li><a href="Fact-or-Fiction.html">Fact or Fiction</li>
    <li><a href="StarTrek.html">Star Trek</a>
        <ul>
            <li><a href="Enterprise.html">Enterprise</a>
            </li>
            <li><a href="Voyager.html">Voyager</a>
            </li>
        </ul>
    </li>
    <li><a href="about.html">About</a>
    </li> </ul>

It must be converted to an array.

I tried several ways to parse, But I fail.

One of the ways that I've used is:

$doc = new \DOMDocument();
$doc->preserveWhiteSpace = false;
$doc->loadHTML($data);
$i = 0;

while( is_object($finance = $doc->getElementsByTagName("li")->item($i)) )
{
    foreach($finance->childNodes as $nodename)
    {
        if($nodename->nodeName == 'li')
        {
            foreach($nodename->childNodes as $subNodes)
            {
                $arr[$i] = $subNodes->nodeValue.PHP_EOL;
            }
        }
        else
        {
            $s = explode('             ', $nodename->nodeValue);
            if (count($s) == 1)
            {
                $arr[$i] =$nodename->nodeValue;
            }
            else
            {
                $arr[$i] =  $s;
            }

        }
    }

    $i++;
}

You need to use a recursive procedure. Find the top-most <ul> and create an array for that. Then find the <li> children and make them elements of the array. Then if the element contains another <ul>, create a sub-array there and recurse. — Barmar
– Barmar, Commented Apr 5, 2016 at 21:53
How are you getting on with this? Have you tried out my example? Please let me know if you need any more guidance. — OrderAndChaos
– OrderAndChaos, Commented Apr 6, 2016 at 6:24
This does not work. This beginning of ths final structure with this code is: Array ( [0] => Home [1] => Array ( [0] => How it works Warp Engine Warp Factors Fuel [1] => Anti-Matter [2] => [3] => Deuterium [4] => [5] => )...... — user3834658
– user3834658, Commented Apr 6, 2016 at 7:21
Have worked out a solution? My updated code should be working now. — OrderAndChaos
– OrderAndChaos, Commented Apr 7, 2016 at 17:55

A.L · Accepted Answer · 2016-04-06 17:27:11Z

The following code gives a nested array. I don't think it's clear exactly what the outputted array should look like, but this code gives the following:

Code:

<?php

class Parser {

    private $elements = [];

    public function parse() {
        $doc = new \DOMDocument();
        $doc->preserveWhiteSpace = false;
        $doc->loadHTMLFile("./html.html");

        $this->parseChildNodes($doc, $this->elements);
    }

    private function parseChildNodes($node, & $arrayToPush) {
        $indexPushed = count($arrayToPush);

        if ($node->nodeName == "li") {
            $representation = [
                "key" => $this->getDisplayValueFromNode($node),
                "items" => []
            ];
            array_push($arrayToPush, $representation);
            $arrayToPush = & $arrayToPush[$indexPushed]["items"];
        }

        if ($node->childNodes == null) {
            return;
        }
        foreach ($node->childNodes as $child) {
            $this->parseChildNodes($child, $arrayToPush);
        }
    }

    /**
     * Get the value of the node's first element
     * In our case this is the text value of the anchor tag
     *
     * @param $node
     * @return String
     */
    private function getDisplayValueFromNode($node) {
        return $node->firstChild->nodeValue;
    }

    public function getElements() {
        return $this->elements;
    }
}

$parser = new Parser();
$parser->parse();
print_r($parser->getElements());

OrderAndChaos · Accepted Answer · 2016-04-06 17:23:51Z

1

It was not easy, but I wasn't aware that you could access the DOM with PHP, so it was an interesting challenge.

This will work for nested lists up to two deep, you could refactor this to make it easier to handle deeper lists.

The below code should help you to get your lists into arrays. I have left echo statements in for ease of demonstration.

<?php
    $data = <<<EOT
<ul id="main-menu">
    <li id="firstNavItem"><a href="index.html">Home</li>
    <li><a href="Warp.html">Warp</a>
        <ul>
            <li><a href="Warp-how-it-works.html">How it works</a>
            </li>
            <li><a href="Warp-Engine.html">Warp Engine</a>
            </li>
            <li><a href="WarpFactors.html">Warp Factors</a>
            </li>
            <li><a href="">Fuel</a>
                <ul>
                    <li><a href="Anti-Matter.html">Anti-Matter</a>
                    </li>
                    <li><a href="Deuterium.html">Deuterium</a>
                    </li>
                </ul>
            </li>
        </ul>
    </li>
    <li><a href="Fact-or-Fiction.html">Fact or Fiction</li>
    <li><a href="StarTrek.html">Star Trek</a>
        <ul>
            <li><a href="Enterprise.html">Enterprise</a>
            </li>
            <li><a href="Voyager.html">Voyager</a>
            </li>
        </ul>
    </li>
    <li><a href="about.html">About</a>
    </li>
</ul>
EOT;

    $doc = new \DOMDocument();
    $doc->preserveWhiteSpace = false;
    $doc->loadHTML($data);

    $list = $doc->getElementsByTagName('ul')->item(0);
    foreach ($list->childNodes as $node) {
        if ($node->nodeName == 'li'
            &&
            $node->lastChild->nodeName != 'ul'
        ) {
            echo $node->textContent . "<br>";
        } else {
            if ($node->lastChild->childNodes) {
                foreach ($node->lastChild->childNodes as $node2) {
                    if ($node2->nodeName == 'li'
                        &&
                        $node2->lastChild->nodeName != 'ul'
                    ) {
                        echo "&bull; " . $node2->textContent . "<br>";
                    } else {
                        if ($node2->lastChild->childNodes) {
                            foreach ($node2->lastChild->childNodes as $node3) {
                                if ($node3->nodeName == 'li'
                                    &&
                                    $node3->lastChild->nodeName != 'ul'
                                ) {
                                    echo "&bull; &bull; " . $node3->textContent . "<br>";
                                }
                            }
                        }
                    }
                }
            }
        }
    }

edited Apr 6, 2016 at 17:23

answered Apr 5, 2016 at 22:52

OrderAndChaos

3,8882 gold badges40 silver badges65 bronze badges

3 Comments

OrderAndChaos Over a year ago

You're right, I must not have had error reporting turned on.

OrderAndChaos Over a year ago

I think I've got a problem with the amount of times the array loops.

OrderAndChaos Over a year ago

You should be able to see that is sort of works, in between the errors the structure is correct. I'm at work at the moment so I can't help any more than that currently. Please let me know how you get on.

AbraCadaver · Accepted Answer · 2016-04-05 23:39:28Z

0

getElementsByTagName() returns all nodes with that name (including nested ones), so there is no need to additionally search through the child nodes. The code in the snippet below returns this array:

Array
(
    [0] => Home
    [1] => Warp
    [2] => How it works
    [3] => Warp Engine
    [4] => Warp Factors
    [5] => Fuel
    [6] => Anti-Matter
    [7] => Deuterium
    [8] => Fact or Fiction
    [9] => Star Trek
    [10] => Enterprise
    [11] => Voyager
    [12] => About
)

Code:

<?php

class Parser {

    private $elements = [];

    public function parse() {
        $doc = new \DOMDocument();
        $doc->preserveWhiteSpace = false;
        $doc->loadHTMLFile("./html.html");

        foreach($doc->getElementsByTagName("li") as $node) {
            array_push($this->elements, $node->firstChild->nodeValue);
        }
    }

    /**
     * Get the value of the node's first element
     * In our case this is the text value of the anchor tag
     *
     * @param $node
     * @return String
     */
    private function getDisplayValueFromNode($node) {
        return $node->firstChild->nodeValue;
    }

    public function getElements() {
        return $this->elements;
    }
}

$parser = new Parser();
$parser->parse();
print_r($parser->getElements());

edited Apr 5, 2016 at 23:39

AbraCadaver

79.2k7 gold badges75 silver badges91 bronze badges

answered Apr 5, 2016 at 22:52

user3834658

3564 silver badges6 bronze badges

6 Comments

OrderAndChaos Over a year ago

The array need to be nested, like the list.

OrderAndChaos Over a year ago

At least, I think it does :/

Ahmad Over a year ago

The array needs to be nested.

user3834658 Over a year ago

Can you please give an example of what the final array should look like? How should the nested items by keyed?

Ahmad Over a year ago

@user3834658 it just converts a nested ul > li list to a nested array, just it. :-)

|

Collectives™ on Stack Overflow

Convert nested <ul><li> to PHP nested array

3 Answers 3

Comments

3 Comments

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

3 Comments

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related