質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
アルゴリズム

アルゴリズムとは、定められた目的を達成するために、プログラムの理論的な動作を定義するものです。

ウェブアプリケーション

ウェブアプリケーションとは、ウェブ上でアクセスされるアプリケーションのことを呼びます。この場合におけるウェブとは、インターネットやイントラネット上を意味します。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

2回答

6363閲覧

収集したデータをツリー構造で出力するためのロジックがわかりません!

退会済みユーザー

退会済みユーザー

総合スコア0

アルゴリズム

アルゴリズムとは、定められた目的を達成するために、プログラムの理論的な動作を定義するものです。

ウェブアプリケーション

ウェブアプリケーションとは、ウェブ上でアクセスされるアプリケーションのことを呼びます。この場合におけるウェブとは、インターネットやイントラネット上を意味します。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

1クリップ

投稿2016/01/13 12:43

初めて質問させて頂きます。よろしくお願い致します。

曖昧な内容の質問になっているかもしれませんが、
意図が伝わらない場合は補足致しますので、
コメントで教えて頂ければ幸いです。

質問内容

仮に以下のようなシンプルなディレクトリー構造があったとして、
このサイトをクロールして以下のページのページタイトルを取得するとします。

  • ホームページ
    *カテゴリーA
    *ページ1
    *ページ2
    *カテゴリーB
    *ページ3
    *カテゴリーC
    *ページ4

そして、最終的には上のようなツリー構造をHTMLのリストタグで表示させるとします。

(1)最終的にツリー構造をリストタグで表示させるためには、
どのように配列なり連想配列をクロール終了時に作っておけば良いのでしょうか?

(2)また、どのようにツリー構造をリストタグで表示させることが出来るのでしょうか?
jqueryでリストに追加をしていくつもりなのですが、(1)で得たデータを、
どう処理していけば、ツリー構造になったものを出力出来るのかが分かりません。
※小難しいアルゴリズムが必要なのでしょうか??

以上、ご回答頂けると非常に助かります!!

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

(1) 単純に配列をネストしていけば良いです。

(2) アルゴリズム的には再帰を使うことで実現できます。

JavaScript

1var titles = [ 2 "ホームページ", 3 [ 4 "カテゴリーA", 5 [ 6 "ページ1", 7 "ページ2" 8 ] 9 ], 10 [ 11 "カテゴリーB", 12 [ 13 "ページ3" 14 ] 15 ], 16 [ 17 "カテゴリーC", 18 [ 19 "ページ4" 20 ] 21 ] 22]; 23 24function echo_html_list(titles){ 25 var out = ""; 26 for(var i = 0; i < titles.length; i++){ 27 if( typeof titles[i] === "string" ){ 28 if( out.length > 0 ) out += "</li><li>"; 29 out += titles[i]; 30 }else{ 31 out += echo_html_list(titles[i]); 32 } 33 } 34 return "<ul><li>" + out + "</li></ul>"; 35} 36 37var out = echo_html_list(titles); 38console.log(out);

投稿2016/01/13 14:16

編集2016/01/13 14:34
退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

home1/categ1/page1
hone1/categ1/page2
home1/categ2/page1
home1/categ3/page1
home1/categ3/page2
home1/categ4/page1
元データを取得して、
こういう配列にして、
スラッシュで分割した2次元配列に変換
同じ名前が続く限り、<li/> タグで囲む。
行頭は、<ul/> 開始タグ、
名前の変わり目は、</ul><ul> タグ。
末尾行は、</ul> タグ。
これで、
ul
li home1
ul
li categ1
ul
li page1
li page2
/ul
li categ2
......
/ul
というツリーになります。再帰しなくてもいけますね

投稿2016/01/14 06:16

ipadcaron

総合スコア1693

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問