我原来的 HTML 看起来像这样:
<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),我想改变它,像这样:
<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>
所以基本上,我希望将所有 HTML 包装在 <h2></h2>
组之间带有 <div class="pane" />
的标签上面的 HTML 已经允许我用 jQuery 创建 Accordion ,这很好,但我想更进一步:
我希望创建所有 <h2></h2>
的 ul受影响的集合,如下所示:
<ul class="tabs">
<li><a href="#">Title of segment one</a></li>
<li><a href="#">Title of segment two</a></li>
</ul>
请注意,我正在使用 jQuery 工具选项卡来实现该系统的 JavaScript 部分,并且它不需要 .tabs 的 href 指向它们特定的 h2 副本。
我的第一个猜测是使用正则表达式,但我也看到有人在谈论 DOM Document
在 jQuery 中存在针对此问题的两种解决方案,但我确实需要一个 PHP 等效方案:
- 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
谁能实际帮助我吗?
最佳答案
DOMDocument 可以帮助您。我之前回答过类似的问题:
using regex to wrap images in tags
更新
包含完整代码示例:
$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 - 用 PHP 用 div 包装 HTML 片段(并从 HTML 标签生成目录),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10683421/