PHP saveHTML 函数没有正确保存 HTML

Question

我一直在尝试使用 PHP 保存网页部分的源代码。 当我提取整个网页的内容时，源代码顺序被保留，但是当我尝试使用

$dom = new DOMDocument;
$dom->loadHTML($webpage);
$xpath = new DOMXPath($dom);

$query_tag = "//div[contains(@class, 'class-name')]";
$result = $dom->saveHTML($xpath->query($query_tag)->item(0));

脚本标签搞砸了。 到目前为止，这是发生此问题的唯一网站。 是否有一些我不知道的saveHTML功能限制？

这是我应该收到的：

<div id="sponsored-category-header" class="page-header sponsored-category-header clear"> <script type="text/javascript">jQuery(document).ready(function($) {
        var cat_head_params = {"sponsor":"SEO PowerSuite","sponsor_logo":"https:\/\/www.searchenginejournal.com\/wp-content\/plugins\/abm-sej\/includes\/category-images\/SPS_128.png","sponsor_text":"<div class=\"taxonomy-description\">Dominate Google local search results with ease! Get your copy of SEO PowerSuite and keep <a rel=\"nofollow\" href=\"http:\/\/sejr.nl\/PowerSuite-2016-5\" onClick=\"__gaTracker('send', 'event', 'Sponsored Category Click Var 1', 'Local Search', 'SEO PowerSuite');\" target=\"_blank\">your local SEO strategy<\/a> up to par.<\/div>","logo_url":"http:\/\/sejr.nl\/PowerSuite-2016-5","ga_labels":["Local Search","SEO PowerSuite"]}            
        $('#sponsored-category-header').append('<div class="sponsored-category-logo"></div>');
                     $('#sponsored-category-header .sponsored-category-logo').append(' <a rel="nofollow" href="'+cat_head_params.logo_url+'" onClick="__gaTracker(\'send\', \'event\', \'Sponsored Category Click Var 1\', \''+cat_head_params.ga_labels[0]+'\', \''+cat_head_params.ga_labels[0]+'\');" target="_blank"><img class="nopin" src="'+cat_head_params.sponsor_logo+'" width="96" height="96" /></a>');
                                   $('#sponsored-category-header').append('<div class="sponsored-category-details"></div>');
         $('#sponsored-category-header .sponsored-category-details').append('<h3 class="page-title sponsored-category-title">'+cat_head_params.sponsor+'</h3>');
         $('#sponsored-category-header .sponsored-category-details').append(cat_head_params.sponsor_text);


});</script> </div>

这是我实际得到的：

<div id="sponsored-category-header" class="page-header sponsored-category-header clear"> <script type="text/javascript">jQuery(document).ready(function($) {
        var cat_head_params = {"sponsor":"SEO PowerSuite","sponsor_logo":"https:\/\/www.searchenginejournal.com\/wp-content\/plugins\/abm-sej\/includes\/category-images\/SPS_128.png","sponsor_text":"<div class=\"taxonomy-description\">Dominate Google local search results with ease! Get your copy of SEO PowerSuite and keep <a rel=\"nofollow\" href=\"http:\/\/sejr.nl\/PowerSuite-2016-5\" onClick=\"__gaTracker('send', 'event', 'Sponsored Category Click Var 1', 'Local Search', 'SEO PowerSuite');\" target=\"_blank\">your local SEO strategy<\/a> up to par.<\/div>","logo_url":"http:\/\/sejr.nl\/PowerSuite-2016-5","ga_labels":["Local Search","SEO PowerSuite"]}            
        $('#sponsored-category-header').append('<div class="sponsored-category-logo"></script>


</div>');
                     $('#sponsored-category-header .sponsored-category-logo').append(' <a rel="nofollow" href="'+cat_head_params.logo_url+'" onclick="__gaTracker(\'send\', \'event\', \'Sponsored Category Click Var 1\', \''+cat_head_params.ga_labels[0]+'\', \''+cat_head_params.ga_labels[0]+'\');" target="_blank"><img class="nopin" src="'+cat_head_params.sponsor_logo+'" width="96" height="96"></a>');
                                   $('#sponsored-category-header').append('<div class="sponsored-category-details"></div>');
         $('#sponsored-category-header .sponsored-category-details').append('<h3 class="page-title sponsored-category-title">'+cat_head_params.sponsor+'</h3>');
         $('#sponsored-category-header .sponsored-category-details').append(cat_head_params.sponsor_text);


    }); </div>

万一你错过了，结束script标签已经上移了几行。

明确地说，我不是在谈论呈现的 HTML。 我说的是我在提出请求后得到的实际源代码。 任何有关如何解决此问题的帮助将不胜感激。

我知道函数saveHTML导致了这个问题，因为当我通过 PHP 回显整个页面时，每个标签都在正确的位置。

Answer 1

首先，您的代码应该触发大量警告，如下所示：

警告：DOMDocument::loadHTML(): htmlParseEntityRef: 期待 ';' 在实体
警告：DOMDocument::loadHTML()：意外的结束标记：实体中的强
警告：DOMDocument::loadHTML()：实体中的标签标头无效

这是可以预料到的流行的 HTML（并且此页面的代码也不是特别糟糕），但您甚至没有提到它，这让我怀疑您的开发框中可能没有启用错误报告。

此外，该页面有大量的 JavaScript，而DOMDocument只是一个 HTML 解析器。

有了这个，我们可以清楚地了解正在发生的事情。 由于DOMDocument不是一个成熟的浏览器，它不理解 JavaScript 代码。 这意味着它检测到<script>标签，但它不会像 JavaScript 一样处理它的内容——它只是寻找一个结束标签，他找到的第一个是这样的：

$('#sponsored-category-header').append('<div class="sponsored-category-logo"></div>');
                                                                             ^^^^^^

它不知道它是一个 JavaScript 字符串，应该被忽略。 相反，它认为错误的标签被关闭，因此它尝试修复技术上无效的 HTML 并添加缺少的</script>标签。

正是出于这个原因， <script>...</script>标签集传统上是这样编写的：

<script type="text/javascript"><!--
var foo = '<p>Escaped end tag<\/p>';
//--></script>

...所以不知道 JavaScript 的用户代理可以安全地忽略整个标签（嘿，它只不过是一个很好的旧 HTML 注释）。 然而，现在它几乎被普遍认为是不好的做法，因为“所有浏览器都理解 JavaScript”。

最后一点：DOM 扩展可能知道<script>标签，并且知道不允许在其中包含其他标签。 这解释了为什么不考虑内部开始标签。