0

ケイ、私はこれに本当に行き詰まりました:/ これまでのタイトルと DOMDocument で述べたように、SimpleHTMLDom を試しました.. $html は、Processwire 駆動ページの CKEditor から取得されます。出力を自動後処理するテキストフォーマッタを作成しました。

これがテストデータです

<?php
$html = <<<_DATA
    <p><img src="http://placehold.it/100x100"><img src="http://placehold.it/130x100">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam</p>
_DATA;

だからここに私のSimpleHTMLDomの試みがあります

<?php
$dom = str_get_html($html);
$imgs = $dom->find('img');

foreach ($imgs as $img) {
    $i = $img->outertext;
    $img->outertext = '';
    $img->parent()->outertext = $i . $img->parent()->outertext;
}
echo $dom->save();
$dom->clear();

上記の $html に img が 1 つしかなく、すべてが期待どおりに機能しますが、それらの 2 つ (またはそれ以上) は重複を返します。

  1. 問題が発生すると、並べ替え順序が変更されるため、130x100 の画像が最初になります。先頭に追加していることはわかっていますが、変更方法がわかりません。すべての画像を変数に詰め込んで順番を保とうとしましたが、それを段落の先頭に追加する方法がわかりません..

  2. 実際にはより重要な問題は重複に関するものです。奇妙なことに、すべての画像を適切に先頭に追加しますが、段落内の最初の画像のみを削除するだけであり、それは追加の画像にも当てはまるため、3 では最後の 2 つを保持します (私が言ったように、 1 で問題なく動作します)

私は何を間違っていますか？

これはおそらく別の質問でより良いでしょうが、DOMDocument も試してみましたが、insertBefore を動作させることができなかったことを示したかった (まったく) さまざまなバリエーションを試しました (以下のコードではコメント解除されています)。

<?php
include_once "./classes/SmartDOMDocument.class.php";
$dom = new SmartDOMDocument();
$dom->loadHTML($html);

$imgs = $dom->getElementsByTagName('img');

foreach ($imgs as $img) {
    $i = $dom->createElement('img');
    $i->src = $img->getAttribute('src');
    $img->parentNode->insertBefore($i, $img->parentNode);
    // $img->insertBefore($i, $img->parentNode);
    // $dom->insertBefore($i, $img->parentNode);
    $img->parentNode->removeChild($img);
}

echo $dom->saveHTMLExact();

何かが十分に文書化されていない、または尋ねられていない場合は、お気軽にコメントしてください。より良い説明を試みます:)

編集： html（上記のwysiwygからのもの）は、段落の途中または最後に画像を保持する場合があり、単一または複数の画像（未定義の数）を含む場合があり、そのhtmlには複数の段落があります

編集：出力をどのようにしたいかを含めるべきでした

これが入力です

<p>
    <img src="http://placehold.it/100x100">
    <img src="http://placehold.it/130x100">
    <img src="http://placehold.it/160x100">
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam
</p>

そして、これは結果でなければなりません

<div class="inlineGallery">
    <figure><img src="http://placehold.it/100x100"></figure>
    <figure><img src="http://placehold.it/130x100"></figure>
    <figure><img src="http://placehold.it/160x100"></figure>
</div>
<p>
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam
</p>

これらの画像を Figure にラップしてからコンテナーに入れる必要があることを言及せずに申し訳ありません..単一のイメージには余分なコンテナーは必要ありませんが、実際には重要ではありません.. figcaption 該当する場合は複数の図を div にラップし、単一の画像のみの記事ですべてが機能し、別の記事で上記のテスト データに似た html に遭遇し、前述の重複が発生しました..だから私はコードを削除しました問題の原因がどこにあるのかを確認するには、運が悪い..そのため、この単純化されたコードを質問に追加したのは、これが機能すると、他のコードも機能すると思ったからです;-)

それが今より明確になることを願っていますか？

4

2 に答える 2