忍者ブログ

2018
09
24

[PR]

×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

2018/09/24 (Mon.)

2011
02
15

topicPath - 目次データから上位のトピックを探す。

前回の「topicPath - 目次データの取得」の記事では、topicPath 用の HTML の構造とそこから目次データを取得する方法について説明しました。

今回は、その目次データから、上位のトピックを探す方法についてです。

前回の記事では、各トピックの目次データが次のようなオブジェクトになっていることを説明しました。

 
{id:id,title:title,parent:parentId}

これを具体的な例で示すと次のようになります。
[
{id:'home', title:'目次',parent:'contents'},
{id:'subcontents1',  title:'目次1',parent:'home'},
{id:'subcontents2',  title:'目次2',parent:'home'},
{id:'content',       title:'内容',  parent:'home'},
{id:'subcontents11', title:'目次1',parent:'subcontents1'},
{id:'subcontents12', title:'目次1',parent:'subcontents1'},
{id:'content1',      title:'内容1',parent:'subcontents1'},
{id:'content21',     title:'内容21',parent:'subcontents2'},
{id:'content22',     title:'内容22',parent:'subcontents2'}
]

現在表示されているトピックの ID が「content22」なら、その親の ID は「subcontents2」ということがわかります。
そして、 ID が「subcontents2」の親の ID が「home」ということもわかります。

すなわち、ID を投入して、親の IDを取得して その属するオブジェクトを配列に加えます。取得した親の ID をまた投入して、親の IDを取得して さらに配列に加えます。それを繰り返して最後に「home」を ID とするオブジェクトを配列に加えたら終わりです。

つまり、結果を引数に再度入れる再帰的な関数を1つ作ればいいということ。
この関数を searchAncestor としましょう。
また、上記のような目次データを arr とし、オブジェクトを格納する配列を paths とすると、次のように記述できます。
function searchAncestor(s){
  for(var i=0;i<arr.length;i++){
    if(arr[i].id==s){
      paths.push(arr[i]);
      if(s!=='home'){
        searchAncestor(arr[i].parent);
      }else{
        return;
      }
    }
  }
}

paths=[];
というように 結果配列を初期化した上で
searchAncestor('content22')

を実行すれば、paths の内容は次のようになります。
[
 {id:'content22',     title:'内容22',parent:'subcontents2'},
 {id:'subcontents2',  title:'目次2',parent:'home'},
 {id:'home', title:'目次',parent:'contents'}
]
 
次は、このデータを使って、HTMLに追加する要素を作成することになります。

PR

2011/02/15 (Tue.) Trackback(0) Comment(0) JavaScript

Comments

名前
メールアドレス
URL
コメント
PASS  Vodafone絵文字 i-mode絵文字 Ezweb絵文字

Trackback

Trackback for this entry:

Links

ご注意

当サイトのスクリプトは、ブラウザが FireFox 3.0 であることを前提に作成されています。IE などでは正常に動作しないものがあります。

カテゴリー

ブログ内検索

最新記事

カレンダー

08 2018/09 10
S M T W T F S
1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30

アーカイブ

RSS

最新CM

[04/15 jTemplate]
[05/22 寝太郎]

プロフィール

HN:
寝太郎
性別:
非公開

バーコード

P R

アクセス解析

リンク

NSM

コガネモチ

フリーエリア