从php循环中找到uniques并在新元素中包装[关闭]

Question

I'm getting following data inside php loop

<ul id="alpha-list">
    <li data-alpha="A">Apple</li>
    <li data-alpha="B">Bat</li>
    <li data-alpha="B">Ball</li>
    <li data-alpha="A">Angel</li>
    <li data-alpha="D">Dog</li>
    <li data-alpha="C">Cat</li>
</ul>

I want to find unique "data-alpha" attribute & wrap them inside parent "ul li" so that result should look similar to this for each "data-alpha".

<ul id="alpha-list">
    <li data-alphabet="A">
        <ul>
           <li data-alpha="A">Angel</li>
           <li data-alpha="A">Apple</li>
        </ul>
    </li>
    <li data-alphabet="B">
        <ul>
           <li data-alpha="B">Ball</li>
           <li data-alpha="B">Bat</li>
        </ul>
    </li>
    ..... 
</ul>

How to achieve this within php ? Any guidance will be appreciated.

Answer 1

$html = <<<EOL
<ul id="alpha-list">
    <li data-alpha="A">Apple</li>
    <li data-alpha="B">Bat</li>
    <li data-alpha="B">Ball</li>
    <li data-alpha="A">Angel</li>
    <li data-alpha="D">Dog</li>
    <li data-alpha="C">Cat</li>
</ul>
EOL;

$dom = new DOMDocument();
$dom->loadHTML($html);

$data = array();

foreach ($dom->getElementsByTagName('li') as $node) {
    $data[$node->getAttribute('data-alpha')][] = $node->textContent;
}

ksort($data);

$dom = new DOMDocument();

$ulElement = $dom->createElement('ul');
$ulElement->setAttribute('id', 'alpha-list');

foreach ($data as $char => $words) {
    $parentLiElement = $dom->createElement('li');
    $parentLiElement->setAttribute('data-alphabet', $char);

    $childUlElement = $dom->createElement('ul');

    foreach ($words as $word) {
        $childLiElement = $dom->createElement('li');
        $childLiElement->setAttribute('data-alpha', $char);
        $childLiElement->appendChild($dom->createTextNode($word));

        $childUlElement->appendChild($childLiElement);
    }

    $parentLiElement->appendChild($childUlElement);
    $ulElement->appendChild($parentLiElement);
}

$dom->appendChild($ulElement);

echo $dom->saveHTML();

This should yield:

<ul id="alpha-list">
    <li data-alphabet="A">
        <ul>
            <li data-alpha="A">Apple</li>
            <li data-alpha="A">Angel</li>
        </ul>
    </li>
    <li data-alphabet="B">
        <ul>
            <li data-alpha="B">Bat</li>
            <li data-alpha="B">Ball</li>
        </ul>
    </li>
    <li data-alphabet="C">
        <ul>
            <li data-alpha="C">Cat</li>
        </ul>
    </li>
    <li data-alphabet="D">
        <ul>
            <li data-alpha="D">Dog</li>
        </ul>
    </li>
</ul>