Question

下面的代码在WordPress内容中搜索单词，并用链接和div替换这些单词。它会产生一个问题，即div会关闭它插入的<p>标记。

$myposts = get_pages(args...);
$replace = array();
$i = 1;

foreach( $myposts as $post ) {
    setup_postdata($post);
    $replace[get_the_title()] = '<a href="#popupBasic' . $i . '" data-rel="popup">' . get_the_title() . '</a><div data-role="popup" class="tooltipBox" id="popupBasic' . $i . '">' . get_the_content() . '</div>';
    $i++;
}

$text = str_replace(array_keys($replace), $replace, $text);

为什么str_replace会像这样打破<p>标签？

<div>
    <p>Some random text thats been <a href="#" class="link">cutt</a></p><div style="display: none;"><!-- placeholder --></div> off.<p></p>
</div>

如果无法在PHP中修复，我们可以用jQuery解决这个问题吗？我想把那些被切断的词放回去，在这种情况下“关闭”。进入链接后关闭的<p>标记。并且还删除最后的空<p>标记。

Answer 1

p elements包含phrasing content。 div在措辞内容中无效，在flow content中有效。（将div放在p内就像将p放在p内。）因此，浏览器正在充分利用无效标记。

尝试使用span而不是div。

str_replace，用div替换word会导致p标记中断

1 个答案: