How to Generate a Hierarchical HTML Tree from Parent-Child Relationships?

Hierarchical Tree Generation from Parent-Child Relationships

Challenge:

Convert a collection of name-parentname pairs into a hierarchical tree structure. The goal is to generate nested HTML unordered lists (

) representing the child-parent relationships.

Recursive Approach:

The solution employs two recursive functions. The first function, parseTree(), traverses the tree structure and constructs a hierarchical tree. It searches for direct children of a specified root and adds them to the resulting tree, recursively parsing each child's children.

function parseTree($tree, $root = null) {
    $return = array();
    foreach($tree as $child => $parent) {
        if($parent == $root) {
            unset($tree[$child]);
            $return[] = array(
                'name' => $child,
                'children' => parseTree($tree, $child)
            );
        }
    }
    return empty($return) ? null : $return;    
}

The second function, printTree(), traverses the tree generated by parseTree() and prints the corresponding HTML unordered list.

function printTree($tree) {
    if(!is_null($tree) && count($tree) > 0) {
        echo '

'; foreach($tree as $node) { echo '
• '.$node['name']; printTree($node['children']); echo '
'; } echo '

'; } }

Usage:

To convert the given name-parentname pairs into a tree structure and print the HTML unordered list, you would call these functions as follows:

$result = parseTree($tree);
printTree($result);

Combined Function:

For improved efficiency, you can merge the two functions into a single function:

function parseAndPrintTree($root, $tree) {
    $return = array();
    if(!is_null($tree) && count($tree) > 0) {
        echo '

'; foreach($tree as $child => $parent) { if($parent == $root) { unset($tree[$child]); echo '
• '.$child; parseAndPrintTree($child, $tree); echo '
'; } } echo '

'; } }

This combined function simplifies the parsing and printing process and reduces the number of iterations required.

The above is the detailed content of How to Generate a Hierarchical HTML Tree from Parent-Child Relationships?. For more information, please follow other related articles on the PHP Chinese website!