No.1ベストアンサー
- 回答日時:
http://detail.chiebukuro.yahoo.co.jp/qa/question …
この人?
今回の質問にDWやXAMPPが何も関係ないってことすら分からんレベルの癖に贅沢言わないでくれないかな…
初心者ですって言えば何でも許されると思ったら大間違いですよ。
・「ランダムに1つ」ならできて「重複なしで3つ」ができないのか
・「1つ」ならできて「3つ」ができないのか
・そもそもランダムができないのか
・「何を」調べて「何が」分からなかったのか
どこまでできて何ができないのかをはっきり言わないと、結局一から十まで教えることになり、宿題を丸投げしてくる小中学生と同レベルです。
何も分からなくて他人に頼るなら、せめてそれくらいは自分で努力してくださいね。
ご希望のプログラムを組むには「配列」「乱数」「HTMLへの出力」などの知識が必要ですが、どれもまったく知らないんでしょ?
初心者が高望みなどせず、順番に覚えなさい。
まずは「配列」について理解しましょう。
次に「乱数」について理解しましょう。
そうすると「配列の中のどれかをランダムにひとつ取得」ができるようになります。
次に、HTMLへの出力を覚えます。
出力するためには、出力する「もの」を作成することと、出力先を取得することが必要になります。
まずは空の<body>内に文字を出力することから始めましょう。
慣れてくれば、特定の場所(今回で言えば特定のテーブルセル内)に特定の要素を入れることができるようになります。
これを組み合わせると「配列の中からランダムに3つを特定の場所に出力」ができます。
これくらいのレベルに来てやっと「重複なく3つ」に手を出せます。
JavaScriptには標準で「配列のある要素を取得し、それは配列から削除する」という機能がありますので、インデックスに乱数を与えてこれを3回行えば「重複なくランダムに3つ」が実現できます。
どうですか?
「何も分かりません全部教えてください」って言ったからって簡単に教えられるような内容じゃない(あなたレベルの人にとって)ことが分かりましたか?
悪いことは言わないからできることからやりましょう。
※下記が動作としてはあなたの希望通りであることを確認してください。
<html>
<head>
<script>
window.onload = function(){
var list = new Array(
'<img src="画像1.jpg" alt="sample1" width="170" height="200">\n<p><a href="画像1.html">説明1</a></p>\n<p>詳細1</p>',
'<img src="画像2.jpg" alt="sample2" width="170" height="200">\n<p><a href="画像2.html">説明2</a></p>\n<p>詳細2</p>',
'<img src="画像3.jpg" alt="sample3" width="170" height="200">\n<p><a href="画像3.html">説明3</a></p>\n<p>詳細3</p>',
'<img src="画像4.jpg" alt="sample4" width="170" height="200">\n<p><a href="画像4.html">説明4</a></p>\n<p>詳細4</p>',
'<img src="画像5.jpg" alt="sample5" width="170" height="200">\n<p><a href="画像5.html">説明5</a></p>\n<p>詳細5</p>',
'<img src="画像6.jpg" alt="sample6" width="170" height="200">\n<p><a href="画像6.html">説明6</a></p>\n<p>詳細6</p>',
'<img src="画像7.jpg" alt="sample7" width="170" height="200">\n<p><a href="画像7.html">説明7</a></p>\n<p>詳細7</p>',
'<img src="画像8.jpg" alt="sample8" width="170" height="200">\n<p><a href="画像8.html">説明8</a></p>\n<p>詳細8</p>',
'<img src="画像9.jpg" alt="sample9" width="170" height="200">\n<p><a href="画像9.html">説明9</a></p>\n<p>詳細9</p>'
);
for(i=1;i<=3;i++){
document.getElementById("td" + i).innerHTML = list.splice(Math.floor(Math.random() * (list.length-1)),1);
}
}
</script>
<title>test</title>
</head>
<body>
<table border="1">
<tr><td width="265" id="td1"></td><td width="265" id="td2"></td><td width="265" id="td3"></td></tr>
</table>
</body>
</html>
この人?
今回の質問にDWやXAMPPが何も関係ないってことすら分からんレベルの癖に贅沢言わないでくれないかな…
初心者ですって言えば何でも許されると思ったら大間違いですよ。
・「ランダムに1つ」ならできて「重複なしで3つ」ができないのか
・「1つ」ならできて「3つ」ができないのか
・そもそもランダムができないのか
・「何を」調べて「何が」分からなかったのか
どこまでできて何ができないのかをはっきり言わないと、結局一から十まで教えることになり、宿題を丸投げしてくる小中学生と同レベルです。
何も分からなくて他人に頼るなら、せめてそれくらいは自分で努力してくださいね。
ご希望のプログラムを組むには「配列」「乱数」「HTMLへの出力」などの知識が必要ですが、どれもまったく知らないんでしょ?
初心者が高望みなどせず、順番に覚えなさい。
まずは「配列」について理解しましょう。
次に「乱数」について理解しましょう。
そうすると「配列の中のどれかをランダムにひとつ取得」ができるようになります。
次に、HTMLへの出力を覚えます。
出力するためには、出力する「もの」を作成することと、出力先を取得することが必要になります。
まずは空の<body>内に文字を出力することから始めましょう。
慣れてくれば、特定の場所(今回で言えば特定のテーブルセル内)に特定の要素を入れることができるようになります。
これを組み合わせると「配列の中からランダムに3つを特定の場所に出力」ができます。
これくらいのレベルに来てやっと「重複なく3つ」に手を出せます。
JavaScriptには標準で「配列のある要素を取得し、それは配列から削除する」という機能がありますので、インデックスに乱数を与えてこれを3回行えば「重複なくランダムに3つ」が実現できます。
どうですか?
「何も分かりません全部教えてください」って言ったからって簡単に教えられるような内容じゃない(あなたレベルの人にとって)ことが分かりましたか?
悪いことは言わないからできることからやりましょう。
※下記が動作としてはあなたの希望通りであることを確認してください。
<html>
<head>
<script>
window.onload = function(){
var list = new Array(
'<img src="画像1.jpg" alt="sample1" width="170" height="200">\n<p><a href="画像1.html">説明1</a></p>\n<p>詳細1</p>',
'<img src="画像2.jpg" alt="sample2" width="170" height="200">\n<p><a href="画像2.html">説明2</a></p>\n<p>詳細2</p>',
'<img src="画像3.jpg" alt="sample3" width="170" height="200">\n<p><a href="画像3.html">説明3</a></p>\n<p>詳細3</p>',
'<img src="画像4.jpg" alt="sample4" width="170" height="200">\n<p><a href="画像4.html">説明4</a></p>\n<p>詳細4</p>',
'<img src="画像5.jpg" alt="sample5" width="170" height="200">\n<p><a href="画像5.html">説明5</a></p>\n<p>詳細5</p>',
'<img src="画像6.jpg" alt="sample6" width="170" height="200">\n<p><a href="画像6.html">説明6</a></p>\n<p>詳細6</p>',
'<img src="画像7.jpg" alt="sample7" width="170" height="200">\n<p><a href="画像7.html">説明7</a></p>\n<p>詳細7</p>',
'<img src="画像8.jpg" alt="sample8" width="170" height="200">\n<p><a href="画像8.html">説明8</a></p>\n<p>詳細8</p>',
'<img src="画像9.jpg" alt="sample9" width="170" height="200">\n<p><a href="画像9.html">説明9</a></p>\n<p>詳細9</p>'
);
for(i=1;i<=3;i++){
document.getElementById("td" + i).innerHTML = list.splice(Math.floor(Math.random() * (list.length-1)),1);
}
}
</script>
<title>test</title>
</head>
<body>
<table border="1">
<tr><td width="265" id="td1"></td><td width="265" id="td2"></td><td width="265" id="td3"></td></tr>
</table>
</body>
</html>
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- MySQL 【MySQL】本当に困っています。詳しい方、ご教授よろしくお願いします。 1 2023/06/03 14:18
- HTML・CSS リンクバナーのHTMLタグ。画像を変えたり、設置位置を変えるとバナー貼付け側はどう見える? 2 2023/02/01 12:01
- Visual Basic(VBA) Powerpointでランダムな数字の結果を表示するマクロ 2 2023/08/04 10:04
- JavaScript HTML&CSS Javascriptによる動的テーブル 1 2023/03/27 19:51
- Access(アクセス) Accessテーブルの結合で別々のテーブルのフィールドを組み合わせて値を出す方法について 2 2022/07/20 19:43
- Access(アクセス) Access 登録ボタンからサブフォームの更新 1 2022/07/22 10:23
- WordPress(ワードプレス) ワードプレスで、左寄せ画像と文字を横並びにせず、画像の下に文字を表示される方法を教えてください 1 2022/04/24 11:06
- Access(アクセス) AccessVBAで降順にするテーブル作成クエリを使用して作成したテーブルを削除し同一のテーブル作成 1 2023/01/06 11:17
- Excel(エクセル) エクセルの数式で教えてください。 1 2022/07/08 13:46
- MySQL 【MySQL】本当に困っているので、助けてください。よろしくお願いします。 3 2023/06/03 14:24
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
ボタンを押したままにする。
-
拡張子無しで画像を表示したいです
-
ホームページにサウンドの「ON...
-
バナーの貼り方とバナーにリン...
-
画像のアドレスについて
-
リンクの上にマウスカーソルを...
-
背景が透明なリンクボタンで、...
-
画像クリックでクリップボード...
-
フォルダ内の画像をウェブでラ...
-
pngやjsの後ろの英数字の意味は...
-
HTMLでデスクトップの画像がでない
-
HTMLタグで画像が表示されない
-
すいません HTMLです この画像...
-
画像を二枚ずつ表示して、選ん...
-
IMGタグでTIFF画像を表示
-
タイトルバーに画像を入れるHTM...
-
崩れたレイアウトが更新すると...
-
IEでのalt属性ポップアップ表示...
-
リンクとして認識されない
-
画像を入れ替える方法
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
ボタンを押したままにする。
-
背景が透明なリンクボタンで、...
-
バナーの貼り方とバナーにリン...
-
HTMLにQRコードを挿入する方法
-
IMGタグでTIFF画像を表示
-
スライドショーの上にロゴマー...
-
pngやjsの後ろの英数字の意味は...
-
タイトルバーに画像を入れるHTM...
-
拡張子無しで画像を表示したいです
-
form以外でのpostってできますか?
-
クリッカブルMAP領域が分かる様...
-
クリックしても、リンクに飛ば...
-
予約語の表示について
-
HTMLでデスクトップの画像がでない
-
崩れたレイアウトが更新すると...
-
カーソルを合わせると文字が出...
-
カウンターのHTMLソースを教え...
-
画像クリックでクリップボード...
-
tifファイルが表示されない
-
IFRAME内に収まるように画像を...
おすすめ情報