我假设您希望在前端使用此值,而不是在块编辑器中需要它,因为<figure>
在块编辑器中查看时,显示不正确。
如果是这种情况,那么您可以使用类似DOMDocument
根据以下示例:
假设HTML为:
<div>
<figure>
<img src="https://example.com/image.jpg" width="300" height="100">
<figcaption> text </figcaption>
</figure>
<figure>
<img src="https://example.com/image.jpg" width="300" height="100">
<figcaption> text </figcaption>
</figure>
<figure>
<img src="https://example.com/image.jpg" width="300" height="100">
<figcaption> text </figcaption>
</figure>
</div>
处理逻辑:
$html = \'<!-- YOUR HTML -->\';
libxml_clear_errors();
$libxml = libxml_use_internal_errors(true);
$dom = new DOMDocument;
$dom->loadHTML($html);
$elements = $dom->getElementsByTagName(\'figure\');
foreach ($elements as $element) {
foreach ($element->getElementsByTagName(\'img\') as $img) {
if ( $img->hasAttribute(\'width\') ) {
$width = $img->getAttribute(\'width\');
$element->setAttribute(\'style\', "width:{$width}px;");
}
}
}
libxml_clear_errors();
libxml_use_internal_errors($libxml);
// for debugging purposes print out the modified HTML
echo $dom->saveHTML();
请随意为现有样式属性添加更多条件保护/检查,以便您可以相应地附加/解析,因为我的示例显示了一个基本用例,只是为了让您开始假设此方法适合您。
结果输出$dom->saveHTML()
:
<div>
<figure style="width:300px;">
<img src="https://example.com/image.jpg" width="300" height="100">
<figcaption> text </figcaption>
</figure>
<figure style="width:300px;">
<img src="https://example.com/image.jpg" width="300" height="100">
<figcaption> text </figcaption>
</figure>
<figure style="width:300px;">
<img src="https://example.com/image.jpg" width="300" height="100">
<figcaption> text </figcaption>
</figure>
</div>
备注:
在客户端上呈现之前,您可以通过the_content
和或类似内容,您可以选择在通过save_post
LibXML/DOMDocument:
由于处理HTML5的问题,DOMDocument
将由于在libxml中引发的错误而生成警告。街上流传的消息是,这些都可以抑制,但我只能通过以下方式抑制它们:
libxml\\u clear\\u errors()
libxml\\u use\\u internal\\u errors()libxml\\u clear\\u errors()libxml\\u use\\u internal\\u errors()或者您可以使用
@
抑制时间:
。。。这比四个额外函数调用的冗长程度要干净一些。
显然,这应该是可行的(因为它是固定的):
$doc->loadHTML($html, LIBXML_NOWARNING);
...但是,我无法使该常量工作(可能是版本问题等),请参见
this 和
this.