用PHP包装HTML的HTML片段（并从HTML标签生成目录） [英] Wrap segments of HTML with divs (and generate table of contents from HTML-tags) with PHP

问题描述

我的原始HTML看起来像这样：

My original HTML looks something like this:

<h1>Page Title</h1>

<h2>Title of segment one</h2>
<img src="img.jpg" alt="An image of segment one" />
<p>Paragraph one of segment one</p>

<h2>Title of segment two</h2>
<p>Here is a list of blabla of segment two</p>
<ul>
  <li>List item of segment two</li>
  <li>Second list item of segment two</li>
</ul>

现在，使用PHP（而不是jQuery），我想改变它，像这样：

Now, using PHP (not jQuery), I want to alter it, like so:

<h1>Page Title</h1>

<div class="pane">
  <h2>Title of segment one</h2>
  <img src="img.jpg" alt="An image of segment one" />
  <p>Paragraph one of segment one</p>
</div>

<div class="pane">
   <h2>Title of segment two</h2>
   <p>Here is a list of blabla of segment two</p>
   <ul>
     <li>List item of segment two</li>
     <li>Second list item of segment two</li>
   </ul>
</div>

所以基本上，我希望将< h2> ;< / h2> 标签与< div class =pane/> 上面的HTML已经允许我创建手风琴使用jQuery，这是很好的，但我想进一步说：

So basically, I wish to wrap all HTML between sets of <h2></h2> tags with <div class="pane" /> The HTML above would already allow me to create an accordion with jQuery, which is fine, but I would like to go a little bit further:

我希望创建一个所有的 h2>< / h2> 集合，如下所示：

I wish to create an ul of all the <h2></h2>sets that were affected, like so:

<ul class="tabs">
  <li><a href="#">Title of segment one</a></li>
  <li><a href="#">Title of segment two</a></li>
</ul>

请注意，我使用jQuery工具选项卡来实现该系统的JavaScript部分，它不要求.tab的href指向他们特定的h2对应。

Please note that I'm using jQuery tools tabs, to implement the JavaScript part of this system, and it does not require that the hrefs of the .tabs point to their specific h2 counterparts.

我的第一个猜测是使用正则表达式，但我也看到一些人们谈论 DOM文档

My first guess would be to use regular expressions, but I've also seen some people talking about DOM Document

两种解决方案在jQuery中存在这个问题，但我真的需要一个PHP等价物：

Two solutions exist for this problem in jQuery, but I really need a PHP equivalent:

• https://stackoverflow.com/questions/7968303/wrapping-a-series-of-elements-between-two -h2-tags-with-jquery


• 根据标题标签自动生成嵌套的目录

• https://stackoverflow.com/questions/7968303/wrapping-a-series-of-elements-between-two-h2-tags-with-jquery
• Automatically generate nested table of contents based on heading tags

任何人都可以帮助我吗？

Could anyone please practically assist me please?

推荐答案

DOMDocument可以帮助您。我之前已经回答过一个类似的问题：

The DOMDocument can help you with that. I've answered a similar question before:

使用正则表达式在标签中包装图像

更新

包含完整代码示例：

$d = new DOMDocument;
libxml_use_internal_errors(true);
$d->loadHTML($html);
libxml_clear_errors();

$segments = array(); $pane = null;

foreach ($d->getElementsByTagName('h2') as $h2) {
    // first collect all nodes
    $pane_nodes = array($h2);
    // iterate until another h2 or no more siblings
    for ($next = $h2->nextSibling; $next && $next->nodeName != 'h2'; $next = $next->nextSibling) {
        $pane_nodes[] = $next;
    }

    // create the wrapper node
    $pane = $d->createElement('div');
    $pane->setAttribute('class', 'pane');

    // replace the h2 with the new pane
    $h2->parentNode->replaceChild($pane, $h2);
    // and move all nodes into the newly created pane
    foreach ($pane_nodes as $node) {
        $pane->appendChild($node);
    }
    // keep title of the original h2
    $segments[] = $h2->nodeValue;
}

//  make sure we have segments (pane is the last inserted pane in the dom)
if ($segments && $pane) {
    $ul = $d->createElement('ul');
    foreach ($segments as $title) {
        $li = $d->createElement('li');

        $a = $d->createElement('a', $title);
        $a->setAttribute('href', '#');

        $li->appendChild($a);
        $ul->appendChild($li);
    }

    // add as sibling of last pane added
    $pane->parentNode->appendChild($ul);
}

echo $d->saveHTML();

这篇关于用PHP包装HTML的HTML片段（并从HTML标签生成目录）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！