是否可以使用 PHP DOMDocument 来操作和返回 HTML 片段？答案

【问题标题】：Is it possible to use PHP DOMDocument to manipulate and return an HTML snippet?是否可以使用 PHP DOMDocument 来操作和返回 HTML 片段？
【发布时间】：2017-03-11 20:27:20
【问题描述】：

Wordpress 使用了一个名为“the_content”的过滤器，我可以使用它来操作 HTML 部分，该部分代表 body 标记在呈现之前的内部内容。（这不是 wordpress 问题，我只是提供上下文。）这意味着没有 DOCTYPE 声明。

这是我正在尝试使用的代码片段：

<div id="x-section-1" > lots of stuff and child divs</div>

我想做的是找到它，然后在它之后立即附加第二个 div。我不能使用字符串替换/正则表达式，因为这个 div 的内部内容经常变化。唯一不变的是#id。

DOMDocument 似乎是这样做的合乎逻辑的选择。我试过了：

@$doc->loadHTML($content);
$snippet = $doc->getElementById('x-section-1');

但是，这会返回一个空结果。实际上，getElementById 手册中的 PHP cmets 指出，如果未定义 DOCTYPE，则返回 null。

所以基于 SE 上的类似问题，我尝试了 DOMXpath：

$dom->loadHTML($content);
$xpath = new DOMXPath($dom);
$div = $xpath->query('//div[@id="x-section-1"]');
$div = $div->item(0);
$snippet = $dom->saveXML($div);

这里的问题是它返回了'$content'的整个值

最后，我遇到的另一个问题是我得到了奇怪的字符格式。尽管我说正则表达式/字符串替换不是一种选择，但这并不完全正确。奇怪的格式只有在我使用 '$dom->save' 函数时才会发生。如果我能得到这个 div 的值，那么我可以将我的新字符串附加到它的末尾，然后查找和替换。

可以为此使用 DOMDocument 吗？如果是这样，怎么做？如果不是，还有什么方法？

注意：这个问题似乎最接近我想要达到的目标。但是，不同之处在于，问题是加载一个完整的 html 文件，我确定它有一个 DOCTYPE。

PHP DomDocument HTML Manipulation

【问题讨论】：

这对你有帮助吗stackoverflow.com/questions/6299433/…
我注意到了那个线程，但我不清楚这些问题是如何加载现有的 html 块以从中提取 div 的。同样，如果 getElementById 必须具有 doctype 声明才能返回值是真的，那么使用 DOM 可能没有实际意义。否则我不知道如何获取该 div 的值
这个怎么样：stackoverflow.com/questions/6491598/…
这与我的第二次尝试非常相似。当我完全按照该问题的代码进行操作时，我得到 'object(DOMNodeList)#2350 (1) { ["length"]=> int(0) } object(DOMNodeList)#2338 (1) { ["length"]=> int (0) } 所以，它仍然为我返回 null，我想知道是不是因为我试图在没有 doctype 的情况下使用 getElementById。 '

标签： php html dom xml-parsing html-parsing

【解决方案1】：

正如您提到的，您想“在 (x-section-1) 之后立即附加第二个 div”
所以您可以简单地使用 (jQuery/Ajax) 进行实时操作并避免所有的大脑头晕：

<script>
$(document).ready(function(){
$("#x-section-1").after("<div id='Second_Div'> YOUR HTML CODE HERE </div>");
});
</script>

将“您的 HTML 代码”替换为您想要的任何 html 代码，
或添加 php 代码 [此处][1]

➳ 注意：如果你想添加大的 html 代码，那么最好是互相粘连
没有“输入空格”的例子：
$("#x-section-1").html('<div id="Second_Div"><label>Users Name:</label></div> <br>');

或者您可以像这样使用+ 分隔行：
 $("#x-section-1").after(
   '<br> <div id="Second_Div">'     +
   '<form action="" method="post">' +
   '<label>Users Name:</label>'     +
   '<br><select name="Users" id="UsersSelect">'  +
   '<option value="$id"> testUserName </option>' +
   '</ select></ form></ div>'
  ); 

或者您可以使用 php $string 填充它，其中包含一些数据，例如：

<?php 
// your string that can contain anything you want .
 $test_string = "userId is :9000 "; 
?>

<script>
$(document).ready(function(){
 $("#x-section-1").after(<?php print $test_string; ?>);
});
</script>

或者你可以同时填充它（html + php）。

如果您希望新代码出现在（单击按钮）之后，您可以使用：

   $("#your button ID here").click(function(){
    $("#x-section-1").after("<div id='Second_Div'> YOUR HTML CODE HERE </div>");
   });

并且不要忘记在页面的开头包含 [Ajax/jQuery 链接]如果没有人：
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

【讨论】：