特定タグの子要素を含めて取得する方法について

このQ&Aのポイント
  • 特定タグの子要素を含めて取得する方法について悩んでいます。
  • 正規表現を使用して取得する方法を試みましたが、難しくてできません。
  • 質問文章のタグの構造に基づいて、特定のタグを含む子要素を配列に格納する方法について教えてください。
回答を見る
  • ベストアンサー

ずっと悩んでます。特定タグを子要素を含め取得したい

ずっと悩んでなかなか解決できません。特定タグを子要素を含め取得したいのですが... 例えば以下のタグがあるとして <div id="1">a<div id="2">b<div id="3">cc</div>b</div>a</div> 特定タグを子要素を含め取得して、それを配列に格納。配列の中は [0] <div id="1">a<div id="2">b<div id="3">cc</div>b</div>a</div> [1] <div id="2">b<div id="3">cc</div>b</div> [2] <div id="3">cc</div> このような配列の結果がでる動作方法はどうやればいいのでしょうか? 正規表現を使ってやろうとしてますが、自分のレベルでは難しくてできません。 よろしくお願いします。

noname#256090
noname#256090
  • PHP
  • 回答数2
  • ありがとう数3

質問者が選んだベストアンサー

  • ベストアンサー
  • masa6272
  • ベストアンサー率66% (93/140)
回答No.2

<?php $s = '<div id="1">a<div id="2">b<div id="3">cc</div>b</div>a</div>'; while(preg_match('/<(\w+)[^>]*>(.*)<\/\1>/', $s, $m)) { $result[] = $m[0]; $s = $m[2]; } var_dump($result); ?> こんな感じでどうでしょう。 正規表現一発じゃないですが。

noname#256090
質問者

お礼

masa6272さんありがとうございました 助かりました

その他の回答 (1)

  • foreach
  • ベストアンサー率51% (43/84)
回答No.1

xpathを使うと簡単にできます。使い方は参考URLを見て下さい。 ただしphp-xmlが必要です。レンタルサーバで入ってなければ使えません。 ちなみにそういうのをDOM操作(あるいはDOM解析)と言いまして、正規表現でも出来ないことないけど汎用的ではありませんのでxpathのようにDOM操作に適したライブラリや環境を使うと良いでしょう。 PHPに拘らなければJavascriptのjQueryもお勧め。 あと、ID値に数値のみだと何かと面倒なので頭にアルファベットを付けるなりしたほうが良いと思います。

参考URL:
http://logic.moo.jp/memo.php/archive/723
noname#256090
質問者

お礼

ご回答ありがとうございます。 問題は無事解決できました。

関連するQ&A

  • 正規表現でdivタグを親要素ごとに配列に格納したい

    divタグを親要素ごとに配列に格納することは可能でしょうか? <div id="1">1<div id="2">2<div id="3">3</div>2</div>1</div> <div id="4">4<div id="5">5</div>4</div> <div id="6">6</div> 配列の中は [0] <div id="1">1<div id="2">2<div id="3">3</div>2</div>1</div> [1] <div id="4">4<div id="5">5</div>4</div> [2] <div id="6">6</div> このような配列の結果が出てほしいです。

    • ベストアンサー
    • PHP
  • dom要素のhtml取得について-get()

    dom要素のhtml取得について-get()メソッドを使用するのがいいのか? don要素のhtmlを取得したいと考えていますが うまくいきません。 以下htmlです。 ------------------------------------------------- <div id="hoge"> <div class="day-number">16</div> <div class="kurasuhoge"><a href="http://hogeURL.com" class="anker">○</a></div> <div class="day-number">17</div> <div class="kurasuhoge"><a href="http://hogeURL2.com" class="anker">○</a></div> </div> ------------------------------------------------- この中のアンカータグを取得し配列に格納したいです。以下のように格納出来れば理想です。 var hairetsu = {16:'<a href="http://hogeURL.com" class="anker">○</a>',17:'<a href="http://hogeURL2.com" class="anker">○</a>']; まずはアンカータグを取得と思い以下を書きました。 ------------------------------------------------- var hensu = $("#hoge .anker").parent().get(); alert(hensu); ------------------------------------------------- 結果[object HTMLDivElement],[object HTMLDivElement] と表示されてしまいます。 今getメソッドを使用していますが 他にいいメソッドがあればアドバイスいただけたら嬉しいです。 まとめますと 「#hogeの中の.anker要素をもつhtmlソースを摘出し配列に格納したいです。」 修正方法をご教示いただければ幸いです。

  • 同じIDで定義した要素の配列を取得したいが

    お世話になります。 ドキュメントで、IDに同じ名前を振付けることで 配列になっている要素を取得する方法を教えたください。 例) <div id="sec1">あああああ</div> <div id="sec1">いいいいい</div> <div id="sec1">ううううう</div> <div id="sec1">えええええ</div> 上記のようなケースだと、「sec1」が配列となって、 定義されますが、実際に取得して使う場合です。 getElementById("sec1")だとnullになりますが、 getElementById("sec1[0]")だと一つずつは取得できます。 これをまとめて配列として取得する方法をお願いいたします。 初心者ですみません。

  • Jqueryで特定のa要素を持つ親要素の取得について

    Jqueryで特定のa要素を持つ親要素の取得について <div id="shop"> <p><a href="http://www.aaaa.jp">お店の名前</a></p> <p>あああああああああ</p> </div> <div id="shop"> <p><a href="http://www.bbbb.jp">お店の名前</a></p> <p>あああああああああ</p> </div> ここから、『http://www.bbbb.jp』のリンクを持つdivを指定するとして・・・ $('a[href*="http://www.bbbb.jp"]').parent().parent().css("background-color","#ccc"); こんな風に書きました。 これでもOKなんですけど、『.parent().parent()』親の親って・・・(汗) もう少しよい親子関係の指定があれば、ぜひ教えていただきたいです!

  • 指定要素のクリック位置を取得したい

    以下のような構造になっています、実際はもう少し複雑になります。子要素の数も不確定。 id=divbox上でクリックしたらid=divboxの左端からの位置を取得したいのですが 子要素上でクリックするとその子要素の左端からの位置になってしまいます 右のほうの白い(=子要素のない)部分だとちゃんと取得できます。 id=divboxの半分の位置でクリックしたとき子要素に影響されずに300前後を取得できるようにするにはどういう風に書けばいいのでしょうか。 <html> <head> <title>Test</title> <style> #divbox {border:solid 1px blue;width:600px;height:20px;} #divbox div{display:inline-block;height:100%;} </style> </head> <body> <div onclick="alert(event.offsetX)" id="divbox"> <div style="width:200px;background-color:orange;">a</div><div style="width:200px;background-color:gray;">b</div> </div> </body> </html> ※webkit系で動けば他はどうでもいいです

  • 変数に入っているHTMLから特定のidのDIVの範囲を取得したい

    変数に入っているHTMLから 特定のidのDIVから、そのDIV閉じまでを取得したいのですが、 良い方法が思いつきません・・・。 ***.getElementsById(***);は、変数には使えないようですし・・・ かといって、変数の内容を、表示されているHTMLにぶちこんでから document.body.getElementsById(***);するのも気がすすみません・・・。 繰り返しと、正規表現のマッチを使って、 目的の<div="***">までの回数とその文字位置をかぞえ、 同じ回数目の</div>の文字位置を調べ、 切り取るというのも考えましたが、それは考えがあまかったようで・・・うまくいきませんでした。 例えば・・・bodyというidのDIVを取得したいとして・・・ 次のようなソースだとすると、あたりまえですけどうまくいきません。 <div id="body"> <div id="a"> テスト1 </div> <div id="b"> テスト2 </div> </div> <div id="footer"> テスト3 </div> 何か良い方法がありませんでしょうか・・・。 みなさんのお知恵をお貸し下さい。どうかよろしく御願いします。

  • 空要素タグ??

    ブログのSEO対策の為に以下のページに自分のページURLを入れ タグが上手く書けているかをチェックしました ​http://openlab.ring.gr.jp/k16/htmllint/htmllinte.html​ すると、その中の回答に 空要素タグ の要素には空白さえも含めることはできません。 という問題点を指摘されました これの意味は XMLの Content of Elements(J)では、空要素タグは、<tag></tag> のように開始タグと終了タグをくっつけて書かなければならないとされてます。つまり、空白も含めることはできません。 という事です そして対象となる部分は以下のタグのどこかにあるようなのですが まったく検討がつきません どこがエラーの対象なのでしょうか? ちなみにブログはMTですのでカスタマイズは問題ありません よろしくお願いします <h2 class="archive-header"><$MTBlogName encode_html="1"$>項目一覧</h2> <div class="entry" id="entry-999"> <MTCategories> <h3 class="entry-header"><a href="<$MTCategoryArchiveLink$>"> <$MTCategoryLabel cutfirstchar="4"$></a></h3> <$MTCategoryDescription$> <div class="entry-content"> <div class="entry-body"> <MTEntries lastn="999"> <a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a>&nbsp;|&nbsp; </MTEntries> </div> <p class="entry-footer"></p> </div> </MTCategories> </div> <p><br /></p> <div class="gotop"><a href="#TOP">このページのトップへ&uarr;</a></div> </div> </div>

  • 条件付きで要素を取得したい

    条件付きで要素を取得したい 次のようなHTMLで、divのclassが「b」内のh2の要素が「ccc」の場合のdivのクラスが「d」の要素を取得したいのです。 つまり下の例では、「111」と「333」を取得したいです。 queryにどのように記述すれば良いのでしょうか? $document =<<<EOF <div class=a>  <div class=b>   <h2 class=c>ccc</h2>   <div class=d>111</div>  </div>  <div class=b>   <h2 class=c>ccc[a]</h2>   <div class=d>222</div>  </div>  <div class=b>   <h2 class=c>ccc</h2>   <div class=d>333</div>  </div> </div> EOF; $xpath = new DOMXPath($document); $xpath->query('ここの記述が知りたい');

    • ベストアンサー
    • PHP
  • 埋め込みタグをinput type内で使いたい

    端末IDを取得しその結果を<div id="View4"></div>で表示できるjavascriptがあります。 これを使用して端末IDをサーバー認証に使うようにしたいと考えています。 現在の問題点 HTML上で、 uid="<div id="View4"></div>" と記載すると、端末上では、 uid=" 01967118-614B-4814-912A-8112F7DDA2E " のように、ちゃんと端末IDを拾っていることが分かります。但し、上記のように改行がされており、uid="01967118-614B-4814-912A-8112F7DDA2E" のようには表示されません。 さらに、<input type="text" id="<div id=\"View4\"></div>">のようにinput typeの中で表示しようとすると、<div id=\"View4\"></div>を文字列として読み込んでしまい、ユーザーIDを表示することができません。 当方がやりたいことは <input type="text" id="01967118-614B-4814-912A-8112F7DDA2E"> の形で表示させることにより、データベースに端末IDをインプットをさせることです。 テキストエリアの改行コードを取り除くには正規表現を使い「文字列..replace(/[\n\r]/g,"")」\で対応可能ということは分かったのですが、<div id=\"View4\"></div>を文字列として読んでしまうことや、埋め込みタグに対する正規表現使用方法が分かりません。 お助けいただきたくお願いいたします。

  • JavaScriptでタグを含む要素が返ってくる

    const base = document.getElementById('parent'); const children = base.children; console.log(children[0]); console.log(children[1]); console.log(children[2]); 下に記述したHTMLの<ul>の子要素を取得するために上記のように記述しました。この場合添付画像のようなタグを含めた要素が返ってきます。タグの中に書かれた内容を取得するにはtextContentを使えば良いようです。 初心者なもので、 <タグを含めた要素を取得してどんな使い道があるのでしょうか? 意味がよくわかりません。  使い慣れた方、これの使い道を教えてください。宜しくお願いいたします。 <ul id="parent"> <li id="first">1番目</li> <li id="second">2番目</li> <li id="third">3番目</li> </ul>

専門家に質問してみよう