getElementsByTagName 未检测到 SVG -- PHP
getElementsByTagName not detecting SVG -- PHP
我正在尝试从 HTML 中获取 <svg> 内容并将其放入一个数组中供以后使用。我的代码...
$html_content = '
<div class="stage" id="shape_1"><svg height="100" version="1.1" width="350" xmlns="http://www.w3.org/2000/svg" style="overflow: hidden; position: relative; left: -0.316681px; top: -0.650024px;"><desc>Created with Raphaël 2.1.2</desc><defs/><rect x="75" y="25" width="200" height="50" r="0" rx="0" ry="0" fill="#90ee90" stroke="#000" style="fill-opacity: 0.5;" fill-opacity="0.5" stroke-width="0"/><path style="stroke-opacity: 0.8;" fill="none" stroke="#666666" d="M75,25L275,25" stroke-width="2" stroke-opacity="0.8"/><path style="stroke-opacity: 0.8;" fill="none" stroke="#666666" d="M275,25L275,75" stroke-width="2" stroke-opacity="0.8"/><path style="stroke-opacity: 0.8;" fill="none" stroke="#666666" d="M275,75L75,75" stroke-width="2" stroke-opacity="0.8"/><path style="stroke-opacity: 0.8;" fill="none" stroke="#666666" d="M75,75L75,25" stroke-width="2" stroke-opacity="0.8"/><text style="text-anchor: middle; font: 15px Arial;" x="175" y="85" text-anchor="middle" font="10px "Arial"" stroke="none" fill="#000000" transform="matrix(1,0,0,1,0,6.5)" font-family="Arial" font-size="15px" font-style="normal" font-weight="normal"><tspan dy="5">x + 10 ft.</tspan></text><text style="text-anchor: end; font: 15px Arial;" x="65" y="50" text-anchor="middle" font="10px "Arial"" stroke="none" fill="#000000" font-family="Arial" font-size="15px" font-style="normal" font-weight="normal"><tspan dy="5">x ft.</tspan></text></svg></div>';
$doc = new DOMDocument();
$doc->loadHTML($html_content);
$svg = $doc->getElementsByTagName('svg');
foreach ($svg as $svg_item) {
array_push($svg_array, $svg_item);
}
print_r($svg_array);
问题是 $svg_array 是空的。不过我知道 $html_content 中肯定有 <svg> 内容。
顺便说一句，我在整个页面上收到了几个警告（因为我 运行 上面的代码在循环中）。他们就像...
"Warning: DOMDocument::loadHTML() [domdocument.loadhtml]: Unexpected end tag : div in Entity, line: 46 in..."
或
"Warning: DOMDocument::loadHTML() [domdocument.loadhtml]: Tag c invalid in Entity, line: 119 in..."
编辑： 经过深入调查，我的代码精简版会产生以下警告...
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：标记 svg 在实体中无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：标签描述在实体中无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：标签定义在实体中无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：标记矩形在实体中无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：实体中的标记路径无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：实体中的标记路径无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：实体中的标记路径无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：实体中的标记路径无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：实体中的标记文本无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：标记 tspan 在实体中无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：实体中的标记文本无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：标记 tspan 在实体中无效，第 2 行......
可能不支持<svg>？？？？
想法?
嗯，这会不会是 PHP 不支持这个？
下面的例子通过javascripts getElementsByTagName获取svg:
var e = document.getElementsByTagName('svg');
console.log(e[0]);
<svg viewBox="0 0 100 100">
</svg>
此功能不适用于 HTML5 元素，例如 SVG。 Web 上的大多数建议是关闭错误，以便让它与 HTML5.
一起工作
既然包含了违规的 html 字符串，问题可能更容易分开，并且可以通过将输入文本分散到多行来进一步调查。完成后，我们得到一个分布在 17 行中的输入字符串。然后我们可以使用警告消息和行号来快速识别损害解析器的输入部分。
'<div class="stage" id="shape_1">
<svg height="100" version="1.1" width="350" xmlns="http://www.w3.org/2000/svg" style="overflow: hidden; position: relative; left: -0.316681px; top: -0.650024px;">
<desc>Created with Raphaël 2.1.2</desc>
<defs/>
<rect x="75" y="25" width="200" height="50" r="0" rx="0" ry="0" fill="#90ee90" stroke="#000" style="fill-opacity: 0.5;" fill-opacity="0.5" stroke-width="0"/>
<path style="stroke-opacity: 0.8;" fill="none" stroke="#666666" d="M75,25L275,25" stroke-width="2" stroke-opacity="0.8"/>
<path style="stroke-opacity: 0.8;" fill="none" stroke="#666666" d="M275,25L275,75" stroke-width="2" stroke-opacity="0.8"/>
<path style="stroke-opacity: 0.8;" fill="none" stroke="#666666" d="M275,75L75,75" stroke-width="2" stroke-opacity="0.8"/>
<path style="stroke-opacity: 0.8;" fill="none" stroke="#666666" d="M75,75L75,25" stroke-width="2" stroke-opacity="0.8"/>
<text style="text-anchor: middle; font: 15px Arial;" x="175" y="85" text-anchor="middle" font="10px "Arial"" stroke="none" fill="#000000" transform="matrix(1,0,0,1,0,6.5)" font-family="Arial" font-size="15px" font-style="normal" font-weight="normal">
<tspan dy="5">x + 10 ft.</tspan>
</text>
<text style="text-anchor: end; font: 15px Arial;" x="65" y="50" text-anchor="middle" font="10px "Arial"" stroke="none" fill="#000000" font-family="Arial" font-size="15px" font-style="normal" font-weight="normal">
<tspan dy="5">x ft.</tspan>
</text>
</svg>
</div>';
现在，如果我们停下来想一想，SVG 实际上不是 html - 它也是 XML 的一种方言。相同的父级，但仍然不是同一个，当我们以您所拥有的方式使用 SVG 时，由于缺乏更好的术语，我们将 XML 嵌入 HTML 中。考虑到这一点，17 条输入行导致以下警告消息就不足为奇了。提到的实体确实不是标准 HTML 实体。 （标签是每行的第 5 个字 - svg、desc、defs 等等）
Warning: DOMDocument::loadHTML(): Tag svg invalid in Entity, line: 2 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag desc invalid in Entity, line: 3 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag defs invalid in Entity, line: 4 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag rect invalid in Entity, line: 5 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag path invalid in Entity, line: 6 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag path invalid in Entity, line: 7 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag path invalid in Entity, line: 8 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag path invalid in Entity, line: 9 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag text invalid in Entity, line: 10 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag tspan invalid in Entity, line: 11 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag text invalid in Entity, line: 13 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag tspan invalid in Entity, line: 14 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
那么，怎么办？简单的。与其尝试使用 loadHTML 方法加载 XML，不如简单地使用 loadXML 方法。完成后，输出变为：
Array ( [0] => DOMElement Object ( [tagName] => svg [schemaTypeInfo] => [nodeName] => svg [nodeValue] => Created with Raphaël 2.1.2 x + 10 ft. x ft. [nodeType] => 1 [parentNode] => (object value omitted) [childNodes] => (object value omitted) [firstChild] => (object value omitted) [lastChild] => (object value omitted) [previousSibling] => (object value omitted) [nextSibling] => (object value omitted) [attributes] => (object value omitted) [ownerDocument] => (object value omitted) [namespaceURI] => http://www.w3.org/2000/svg [prefix] => [localName] => svg [baseURI] => file:/C:/xampp2/htdocs/*redacted*/ [textContent] => Created with Raphaël 2.1.2 x + 10 ft. x ft. ) )
我正在尝试从 HTML 中获取 <svg> 内容并将其放入一个数组中供以后使用。我的代码...
$html_content = '
<div class="stage" id="shape_1"><svg height="100" version="1.1" width="350" xmlns="http://www.w3.org/2000/svg" style="overflow: hidden; position: relative; left: -0.316681px; top: -0.650024px;"><desc>Created with Raphaël 2.1.2</desc><defs/><rect x="75" y="25" width="200" height="50" r="0" rx="0" ry="0" fill="#90ee90" stroke="#000" style="fill-opacity: 0.5;" fill-opacity="0.5" stroke-width="0"/><path style="stroke-opacity: 0.8;" fill="none" stroke="#666666" d="M75,25L275,25" stroke-width="2" stroke-opacity="0.8"/><path style="stroke-opacity: 0.8;" fill="none" stroke="#666666" d="M275,25L275,75" stroke-width="2" stroke-opacity="0.8"/><path style="stroke-opacity: 0.8;" fill="none" stroke="#666666" d="M275,75L75,75" stroke-width="2" stroke-opacity="0.8"/><path style="stroke-opacity: 0.8;" fill="none" stroke="#666666" d="M75,75L75,25" stroke-width="2" stroke-opacity="0.8"/><text style="text-anchor: middle; font: 15px Arial;" x="175" y="85" text-anchor="middle" font="10px "Arial"" stroke="none" fill="#000000" transform="matrix(1,0,0,1,0,6.5)" font-family="Arial" font-size="15px" font-style="normal" font-weight="normal"><tspan dy="5">x + 10 ft.</tspan></text><text style="text-anchor: end; font: 15px Arial;" x="65" y="50" text-anchor="middle" font="10px "Arial"" stroke="none" fill="#000000" font-family="Arial" font-size="15px" font-style="normal" font-weight="normal"><tspan dy="5">x ft.</tspan></text></svg></div>';
$doc = new DOMDocument();
$doc->loadHTML($html_content);
$svg = $doc->getElementsByTagName('svg');
foreach ($svg as $svg_item) {
array_push($svg_array, $svg_item);
}
print_r($svg_array);
问题是 $svg_array 是空的。不过我知道 $html_content 中肯定有 <svg> 内容。
顺便说一句，我在整个页面上收到了几个警告（因为我 运行 上面的代码在循环中）。他们就像...
"Warning: DOMDocument::loadHTML() [domdocument.loadhtml]: Unexpected end tag : div in Entity, line: 46 in..."
或
"Warning: DOMDocument::loadHTML() [domdocument.loadhtml]: Tag c invalid in Entity, line: 119 in..."
编辑： 经过深入调查，我的代码精简版会产生以下警告...
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：标记 svg 在实体中无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：标签描述在实体中无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：标签定义在实体中无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：标记矩形在实体中无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：实体中的标记路径无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：实体中的标记路径无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：实体中的标记路径无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：实体中的标记路径无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：实体中的标记文本无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：标记 tspan 在实体中无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：实体中的标记文本无效，第 2 行......
警告：DOMDocument::loadHTML() [domdocument.loadhtml]：标记 tspan 在实体中无效，第 2 行......
可能不支持<svg>？？？？
想法?
嗯，这会不会是 PHP 不支持这个？
下面的例子通过javascripts getElementsByTagName获取svg:
var e = document.getElementsByTagName('svg');
console.log(e[0]);
<svg viewBox="0 0 100 100">
</svg>
此功能不适用于 HTML5 元素，例如 SVG。 Web 上的大多数建议是关闭错误，以便让它与 HTML5.
一起工作既然包含了违规的 html 字符串，问题可能更容易分开，并且可以通过将输入文本分散到多行来进一步调查。完成后，我们得到一个分布在 17 行中的输入字符串。然后我们可以使用警告消息和行号来快速识别损害解析器的输入部分。
'<div class="stage" id="shape_1">
<svg height="100" version="1.1" width="350" xmlns="http://www.w3.org/2000/svg" style="overflow: hidden; position: relative; left: -0.316681px; top: -0.650024px;">
<desc>Created with Raphaël 2.1.2</desc>
<defs/>
<rect x="75" y="25" width="200" height="50" r="0" rx="0" ry="0" fill="#90ee90" stroke="#000" style="fill-opacity: 0.5;" fill-opacity="0.5" stroke-width="0"/>
<path style="stroke-opacity: 0.8;" fill="none" stroke="#666666" d="M75,25L275,25" stroke-width="2" stroke-opacity="0.8"/>
<path style="stroke-opacity: 0.8;" fill="none" stroke="#666666" d="M275,25L275,75" stroke-width="2" stroke-opacity="0.8"/>
<path style="stroke-opacity: 0.8;" fill="none" stroke="#666666" d="M275,75L75,75" stroke-width="2" stroke-opacity="0.8"/>
<path style="stroke-opacity: 0.8;" fill="none" stroke="#666666" d="M75,75L75,25" stroke-width="2" stroke-opacity="0.8"/>
<text style="text-anchor: middle; font: 15px Arial;" x="175" y="85" text-anchor="middle" font="10px "Arial"" stroke="none" fill="#000000" transform="matrix(1,0,0,1,0,6.5)" font-family="Arial" font-size="15px" font-style="normal" font-weight="normal">
<tspan dy="5">x + 10 ft.</tspan>
</text>
<text style="text-anchor: end; font: 15px Arial;" x="65" y="50" text-anchor="middle" font="10px "Arial"" stroke="none" fill="#000000" font-family="Arial" font-size="15px" font-style="normal" font-weight="normal">
<tspan dy="5">x ft.</tspan>
</text>
</svg>
</div>';
现在，如果我们停下来想一想，SVG 实际上不是 html - 它也是 XML 的一种方言。相同的父级，但仍然不是同一个，当我们以您所拥有的方式使用 SVG 时，由于缺乏更好的术语，我们将 XML 嵌入 HTML 中。考虑到这一点，17 条输入行导致以下警告消息就不足为奇了。提到的实体确实不是标准 HTML 实体。 （标签是每行的第 5 个字 - svg、desc、defs 等等）
Warning: DOMDocument::loadHTML(): Tag svg invalid in Entity, line: 2 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag desc invalid in Entity, line: 3 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag defs invalid in Entity, line: 4 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag rect invalid in Entity, line: 5 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag path invalid in Entity, line: 6 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag path invalid in Entity, line: 7 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag path invalid in Entity, line: 8 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag path invalid in Entity, line: 9 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag text invalid in Entity, line: 10 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag tspan invalid in Entity, line: 11 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag text invalid in Entity, line: 13 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
Warning: DOMDocument::loadHTML(): Tag tspan invalid in Entity, line: 14 in C:\xampp2\htdocs\*redacted*\svg.php on line 23
那么，怎么办？简单的。与其尝试使用 loadHTML 方法加载 XML，不如简单地使用 loadXML 方法。完成后，输出变为：
Array ( [0] => DOMElement Object ( [tagName] => svg [schemaTypeInfo] => [nodeName] => svg [nodeValue] => Created with Raphaël 2.1.2 x + 10 ft. x ft. [nodeType] => 1 [parentNode] => (object value omitted) [childNodes] => (object value omitted) [firstChild] => (object value omitted) [lastChild] => (object value omitted) [previousSibling] => (object value omitted) [nextSibling] => (object value omitted) [attributes] => (object value omitted) [ownerDocument] => (object value omitted) [namespaceURI] => http://www.w3.org/2000/svg [prefix] => [localName] => svg [baseURI] => file:/C:/xampp2/htdocs/*redacted*/ [textContent] => Created with Raphaël 2.1.2 x + 10 ft. x ft. ) )