Question

我这里有一个奇怪的问题，但它完全让我难过。最重要的是，这是因为我无法想到要搜索的正确术语，所以这个问题可能会在某个地方的StackOverflow上得到解答，但我找不到它。

我们有一个校对系统，可以让我们拍摄一个页面并对其进行注释。我们可以将页面发送给我们的客户，他们可以在发回之前对其进行记录。在大多数情况下，这很好。当我们尝试使用类似于Handlebars的JavaScript模板系统时，问题就出现了。我们的页面上往往有脚本模板，如下所示：

<script type="client/template" id="foo-div">
<div>#foo#</div>
</script>

我们可以在脚本中使用它来生成模板中的标记，用正确的数据替换#foo#。

当我们尝试将其纳入我们的校对系统时，问题就出现了。因为我们需要抓取页面以便我们可以在我们的域上呈现，所以我们使用PHP的DOMDocument来解析HTML，以便我们可以轻松地修改它（将target="_blank"之类的内容添加到外部链接等）。当我们尝试通过DOMDocument运行我们的模板时，它会奇怪地解析它（可能将其视为无效的XML）并导致页面出现问题。为了更好地说明这一点，这是PHP中的一个例子：

<?php

error_reporting(E_ALL);
ini_set('display_errors', 1);

$html = '<!DOCTYPE html>'.
    '<html>'.
    '<head></head>'.
    '<body>'.
    '<script type="client/template" id="foo-div"><div>#foo#</div></script>'.
    '</body>'.
    '</html>';

$dom = new DOMDocument();

libxml_use_internal_errors(true);

try {
    $html = $dom->loadHTML($html);
} catch (Exception $e) {
    throw new Exception('Invalid HTML on the page has caused a parsing error');
}

if ($html === false) {
    throw new Exception('Unable to properly parse page');
}

$dom->preserveWhiteSpace = false;
$dom->formatOutput = false;

echo $dom->saveHTML();

此脚本生成类似于下面的HTML的代码，似乎不会抛出任何异常。

<!DOCTYPE html>
<html>
<head></head>
<body><script type="client/template" id="foo-div"><div>#foo#</script></body>
</html>

我的问题是：有没有人知道我可以让PHP的DOMDocument单独留下模板script标签？我是否可以使用设置或插件DOMDocument查看script标记的内容，type属性为纯文本，就像浏览器一样？

修改

我最终使用Alf Eaton的解决方案或将字符串解析为XML。但是，并非所有HTML标记都是自动关闭的，并且会导致问题。我在这里发布了完整的解决方案，以防任何人遇到同样的问题：

/**
 * Inserts a new string into an old string at the specified position.
 * 
 * @param string $old_string Old string to modify.
 * @param string $new_string New string to insert.
 * @param int $position Position at which the new string should be inserted.
 * @return string Old string with new string inserted.
 * @see http://stackoverflow.com/questions/8251426/insert-string-at-specified-position
 */
function str_insert($old_string, $new_string, $position) {

    return substr($old_string, 0, $position) . $new_string .
        substr($old_string, $position);

}

/**
 * Inspects a string of HTML and closes any tags that need self-closing in order
 * to make the HTML valid XML.
 * 
 * @param string $html Raw HTML (potentially invalid XML)
 * @return string Original HTML with self-closing slashes added.
 */
function self_close($html) {

    $fixed = $html;
    $tags  = array('area', 'base', 'basefont', 'br', 'col', 'frame',
        'hr', 'img', 'input', 'link', 'meta', 'param');

    foreach ($tags as $tag) {

        $offset = 0;

        while (($offset = strpos($fixed, '<' . $tag, $offset)) !== false) {

            if (($close = strpos($fixed, '>', $offset)) !== false &&
                    $fixed[$close - 1] !== '/') {
                $fixed = str_insert($fixed, '/', $close);
            }

            $offset += 1; // Prevent infinite loops

        }

    }

    return $fixed;

}

// When parsing the original string:
$html = $dom->loadXML(self_close($html));

Answer 1

如果输入文档是有效的XML，则将其解析为XML而不是HTML将保留<script>标记的内容：

<?php

$html = <<<END
<!DOCTYPE html>
<html><body>
<script type="client/template" id="foo-div"><div>#foo#</div></script>
</body></html>
END;

$doc = new DOMDocument();
$doc->preserveWhiteSpace = true; // needs to be before loading, to have any effect
$doc->loadXML($html);
$doc->formatOutput = false;
print $doc->saveHTML();

// <!DOCTYPE html>
// <html><body>
// <script type="client/template" id="foo-div"><div>#foo#</div></script>
// </body></html>

Answer 2

当PHP的DOMDocument解析HTML时，它使用一些故障安全技术在脚本标记的情况下，有两个。

首先是一个特殊的cript-tag内容处理 - 因为<script>标记不能包含任何其他标记，其中的所有内容都被假定为文本。

第二种技术是整个html标签 - autoclose hack。当解析器找到错误节奏的结束标记时，它会尝试查找最近的父开始标记，并在此找到的open-tag和错误放置的close-tag之间自动关闭每个标记。如果解析器找不到合适的open-tag，则只会忽略close-tag。

如果您尝试解析像<body><div><script type="client/template" id="foo-div"><div>#foo#</div>dfdf</script></div></body>这样的代码，您可以看到这一点 - 您将在脚本中获得<body><div><script type="client/template" id="foo-div"><div>#foo#</script></div>dfdf</body>。

没有正常的方法可以让DOMDocument以你想要的方式解析html5 但是您可以使用简单的黑客 - 只需用<替换所有开放的角括号<，或者用正则表达式替换脚本标记内的任何其他未使用的符号。经过处理后，您可以通过相同的程序获得所有回复。

如何将PHP DOMDocument与JavaScript模板结合起来

2 个答案: