Javascriptでloop処理

質問

一点ご質問で、書かせていただきました。

Javascriptには全くの初心者同然の中で一生懸命やったのですが、
わからないまま積んでしまったので、どなたか助けていただけませんでしょうか？

<div class="demo" id="test1">test1</div>
<div class="demo" id="test2">test2</div>
<div class="demo" id="test3">test3</div>

new Tip('test1' , 'jiojoi;j;ioj' , {
title: "Click",
closeButton: true,
showOn: 'click',
hideOn: { element: 'closeButton', event: 'click'},
stem: 'bottomMiddle',
hook: { target: 'topMiddle', tip: 'bottomMiddle' },
offset: { x: 0, y: -2 },
width: 'auto'
});
new Tip('test2' , 'jiojoi;j;ioj' , {
title: "Click",
closeButton: true,
showOn: 'click',
hideOn: { element: 'closeButton', event: 'click'},
stem: 'bottomMiddle',
hook: { target: 'topMiddle', tip: 'bottomMiddle' },
offset: { x: 0, y: -2 },
width: 'auto'
});
・
　　　　　　　　　・
　　　　　　　　　 .
.

もしこれが５０個並ぶようになってしまったら大変なのですが、
fonなどで、ループ処理をすればいいと思ったのですが、
案の定自分ではいろいろ試したのですが、全て何も反応せず
終わってしまいました。

お手数ですが、アドバイス等いただけるととても助かります！
よろしくお願い致します。

回答No.1

fujillin · ベストアンサー

なにかのライブラリを使っているのでしょうけれど、ご提示の情報だけでは何かを定義しているということしかわからないので、なんとも言えません。
new Tip()となっているので、多分『ツールチップでも表示させるものなのかな～』という推測ができはするのですが

---以下まったくの推測なので、はずれている確率が高いです---

第一引数は要素のidらしいけれど、第二引数が意味不明なのでわからないのですが、表示するコンテンツか何かか…
タイトル以下のオブジェクトは例示ではみな同じみたいだけれどそうであるなら、idと表示コンテンツだけがセットで変わるものとして…

//第一引数と第二引数のデータをまとめて定義
var data = [　
["test1","jiojoi;j;ioj"],
["test2","jiojoi;j;ioj"],
["test3","jiojoi;j;ioj"],
・・・・・・・・・
],
//共通するデータを先に定義しておく
option = {
title: "Click",
closeButton: true,
showOn: "click",
hideOn: { element:"'closeButton", event: "click"},
stem: "bottomMiddle",
hook: { target: "topMiddle", tip: "bottomMiddle" },
offset: { x: 0, y: -2 },
width: "auto"
};

//必要な数だけTip()を設定
for(var i=0, n=data.length; i<n; i++) new Tip(data[i][0], data[i][1], option);

みたいにしてループさせればよろしいかと。
個別に指定したい部分が他にもあればそれもdataで個別に指定するようにして、要は、共通部分をまとめておいてループにいちいち書かないというだけのことです。
（個別に指定したいデータの分のデータは、50個分なら50個分必要になります。外部スクリプトにしておくなどの方法はありますが。）

お礼

情報が少なくて申し訳ありません。

このソースコードで、自分なりに勉強してみます。

ありがとうございました！