W i S T E R I A

B O A R D
 
●新規 ●トレリス表示 ●一覧表示 ●ログ検索 ●ヘルプ ●ホームへ
●関連記事の一覧

139
ぜひご教授ください by なおし 2006/08/10 (Thu) 15:42
△up
res/edit
 
ジャバスクリプトを勉強し始めているのですが…次のことがわからず行き詰まっています。ぜひご教授いただきたいと思い、書き込ませていただきます。

データをhtmlに、ジャバスクリプトで表にしようとしていて、ジャバスクリプトファイル(a.js)とデータは別ファイル化(b.jsとc.js)することを前提にしています。
いざ作りはじめたところ、データが多いことがわかったので、表を2列にしたものにできないか、と考えたのですが、その場合、a.jsはどのように書き込めばよいのか、皆目検討がつきません。

よろしくお願いします。

ちなみに、今現在の状況はこうなっています。
a.js↓
html = '<TABLE cellpadding="3" cellspacing="2" width="100%">'
  for (i=data.length-1;i>=0;i--)
//昇順:  for (i=0;i<data.length;i++)
//降順: for (i=data.length-1;i>=0;i--)
{
html += ' <TBODY><TR>'
html += ' <TD bgcolor="#ffffff" onmouseover="this.style.backgroundColor='#8b0000'" onmouseout="this.style.backgroundColor=''"> '
html += ' <TABLE width="100%" cellpadding="1" cellspacing="0" bgcolor="#ffffff"> '
html += ' <TBODY><TR> '
html += ' <td><a href= ' +link[i]+' >'
html += ' '+data[i]+ ' </td>'
html += ' </tr></tbody></table>'
html += ' </td></tr></tbody>'
}
html += '</table>'

//書き出し
document.write( html )



b.js↓
var data = new Array()
data[50] = "aaaaa"
data[49] = "bbbbb"
 ・
 ・
data[0] = "xxxxx"

c.js↓
var link = new Array()
link[50] = "049.html"
link[49] = "048.html"
 ・
 ・
link[0] = "001.html"
140
Re1:ぜひご教授ください by 管理人 2006/08/10 (Thu) 22:46
△up
res/edit
admin
 
HTML:
<script type="text/javascript" src="a.js"></script>
<body>
<input type="button" onclick="tbl()" value="go">
<iframe src="b.txt" id="b" name="b" style="display:none"></iframe>
<iframe src="c.txt" id="c" name="c" style="display:none"></iframe>
</body>

a.js:
var html = '<html>\n<body>\n<table border=1>\n';
function tbl(){
var bwin = window.b;
var bsrc = bwin.document.body.innerText;
var data = new Array();
data = bsrc.split(";");
var cwin = window.c;
var csrc = cwin.document.body.innerText;
var link = new Array();
link = csrc.split(";");
n = data.length;
i = n - 1;
while(data[i]){
txt = delesc(data[i]);
lnk = delesc(link[i]);
j = i-1;
html += '<tr><td>';
html += '<a href=' + lnk +'\>';
html += txt + '</td><td>';
if(j>=0){
txt = delesc(data[j]);
lnk = delesc(link[j]);
html += '<a href=' + lnk +'\>';
html += txt;
}
html += '</td></tr>\n';
i = i-2;
}
html += '</table>\n</body>\n</html>';
document.write(html);
}
function delesc(dat){
var dstr = dat;
dstr = dstr.replace(" ","");
dstr = dstr.replace("\r","");
dstr = dstr.replace("\n","");
dstr = dstr.replace("\r\n","");
dstr = dstr.replace("^","");
return dstr;
}

b.txt:
"000";
"001";
"010";
"011";
"100";
"101";
"110";
"111";
"1000"

c.txt:
"000.html";
"001.html";
"010.html";
"011.html";
"100.html";
"101.html";
"110.html";
"111.html";
"1000.html"

b.txt, c.txtの各データ行は、最終行を除いて全て半角のセミコロン[;]が必須。
また、b.txtとc.txtの行数(データ数)は一致していること。
141
Re2:ぜひご教授ください by なおし 2006/08/10 (Thu) 23:32
△up
res/edit
 
ありがとうございます。
そのまま使わせていただきます♪
p.ink