[解決済み] phpを使ってhtmlからimg src、title、altを抽出するには？[重複しています]。

質問

私のウェブサイトにあるすべての画像を、タイトルと代替表現とともに一覧表示するページを作成したいのですが、可能でしょうか？

すべてのHTMLファイルを検索して読み込む小さなプログラムを既に書きましたが、今、どのようにすれば src , title と alt をこのHTMLから削除します。

<img src="/image/fluffybunny.jpg" title="Harvey the bunny" alt="a cute little fluffy bunny" />

これは何らかの正規表現で行うべきなのでしょうが、タグの順序が異なる可能性があり、私はすべてのタグが必要なので、これをエレガントに解析する方法がよくわかりません（char by charという難しい方法で行うこともできますが、それは苦痛です）。

どのように解決するのですか？

EDIT : よくわかるようになりました

この種の問題を解決するために正規表現を使用することは 悪い考え そして、メンテナンスがしにくく、信頼性の低いコードになる可能性が高いです。それよりも HTMLパーサー .

正規表現による解決方法

その場合、処理を2つに分けた方がよいでしょう。

• すべてのimgタグを取得する
• メタデータを抽出する

あなたの文書はxHTML strictではないので、XMLパーサーを使用することはできないと仮定します。例えば、このウェブページのソースコードでは :

/* preg_match_all match the regexp in all the $html string and output everything as 
an array in $result. "i" option is used to make it case insensitive */

preg_match_all('/<img[^>]+>/i',$html, $result); 

print_r($result);
Array
(
    [0] => Array
        (
            [0] => <img src="/Content/Img/stackoverflow-logo-250.png" width="250" height="70" alt="logo link to homepage" />
            [1] => <img class="vote-up" src="/content/img/vote-arrow-up.png" alt="vote up" title="This was helpful (click again to undo)" />
            [2] => <img class="vote-down" src="/content/img/vote-arrow-down.png" alt="vote down" title="This was not helpful (click again to undo)" />
            [3] => <img src="http://www.gravatar.com/avatar/df299babc56f0a79678e567e87a09c31?s=32&d=identicon&r=PG" height=32 width=32 alt="gravatar image" />
            [4] => <img class="vote-up" src="/content/img/vote-arrow-up.png" alt="vote up" title="This was helpful (click again to undo)" />

[...]
        )

)

次に、imgタグの属性をすべてループで取得します。

$img = array();
foreach( $result as $img_tag)
{
    preg_match_all('/(alt|title|src)=("[^"]*")/i',$img_tag, $img[$img_tag]);
}

print_r($img);

Array
(
    [<img src="/Content/Img/stackoverflow-logo-250.png" width="250" height="70" alt="logo link to homepage" />] => Array
        (
            [0] => Array
                (
                    [0] => src="/Content/Img/stackoverflow-logo-250.png"
                    [1] => alt="logo link to homepage"
                )

            [1] => Array
                (
                    [0] => src
                    [1] => alt
                )

            [2] => Array
                (
                    [0] => "/Content/Img/stackoverflow-logo-250.png"
                    [1] => "logo link to homepage"
                )

        )

    [<img class="vote-up" src="/content/img/vote-arrow-up.png" alt="vote up" title="This was helpful (click again to undo)" />] => Array
        (
            [0] => Array
                (
                    [0] => src="/content/img/vote-arrow-up.png"
                    [1] => alt="vote up"
                    [2] => title="This was helpful (click again to undo)"
                )

            [1] => Array
                (
                    [0] => src
                    [1] => alt
                    [2] => title
                )

            [2] => Array
                (
                    [0] => "/content/img/vote-arrow-up.png"
                    [1] => "vote up"
                    [2] => "This was helpful (click again to undo)"
                )

        )

    [<img class="vote-down" src="/content/img/vote-arrow-down.png" alt="vote down" title="This was not helpful (click again to undo)" />] => Array
        (
            [0] => Array
                (
                    [0] => src="/content/img/vote-arrow-down.png"
                    [1] => alt="vote down"
                    [2] => title="This was not helpful (click again to undo)"
                )

            [1] => Array
                (
                    [0] => src
                    [1] => alt
                    [2] => title
                )

            [2] => Array
                (
                    [0] => "/content/img/vote-arrow-down.png"
                    [1] => "vote down"
                    [2] => "This was not helpful (click again to undo)"
                )

        )

    [<img src="http://www.gravatar.com/avatar/df299babc56f0a79678e567e87a09c31?s=32&d=identicon&r=PG" height=32 width=32 alt="gravatar image" />] => Array
        (
            [0] => Array
                (
                    [0] => src="http://www.gravatar.com/avatar/df299babc56f0a79678e567e87a09c31?s=32&d=identicon&r=PG"
                    [1] => alt="gravatar image"
                )

            [1] => Array
                (
                    [0] => src
                    [1] => alt
                )

            [2] => Array
                (
                    [0] => "http://www.gravatar.com/avatar/df299babc56f0a79678e567e87a09c31?s=32&d=identicon&r=PG"
                    [1] => "gravatar image"
                )

        )

   [..]
        )

)

RegexpsはCPUに負荷がかかるので、このページをキャッシュしておくとよいでしょう。キャッシュシステムが無い場合は ob_start で、テキストファイルから読み込み/保存します。

この仕組みはどうなっているの？

まず preg_ match_ all パターンにマッチするすべての文字列を取得し、3番目のパラメータに出力する関数です。

正規表現:

<img[^>]+>

すべてのhtmlウェブページに適用しています。読み方としては で始まるすべての文字列。 <img "を含み、">"以外の文字を含み、>.で終了する。 .

(alt|title|src)=("[^"]*")

これを各 img タグに順次適用していく。読み方としては alt", "title" または "src" で始まり、 "=" を経て、' " '、' " ' 以外のものが並び、' " ' で終わる文字列です。()の間にあるサブ文字列を分離します。 .

最後に、正規表現を扱う際には、それを素早くテストするための優れたツールがあると便利です。これをチェック オンラインREGEXPテスター .

EDIT : 最初のコメントへの回答です。

たしかにシングルクォートを使っている人が（少なければいいのですが）考えていませんでした。

まあ、' だけ使うなら、" を全部 ' に置き換えればいいんだけど。

両方が混在している場合。まず自分をひっぱたいてください :-) そして、("|') を代わりに使うか、 " と [^ø] を [^"] に置き換えてみてください。