たとえば、一連の単語を取り上げようとしています...
Apple
Banana
The
Orange
House
Boat
Lake
Car
And
javascriptを使用して、これらの単語のうち50個をランダムにdivに出力できるようにしたいと思います。これは可能ですか?もしそうなら、それらを配列または類似のものに入れることを検討する必要がありますか?
たとえば、一連の単語を取り上げようとしています...
Apple
Banana
The
Orange
House
Boat
Lake
Car
And
javascriptを使用して、これらの単語のうち50個をランダムにdivに出力できるようにしたいと思います。これは可能ですか?もしそうなら、それらを配列または類似のものに入れることを検討する必要がありますか?
はい、それは可能です。Math.random
関数を使用してテキストを生成しinnerHTML
、divを埋めます。
配列を使用すると、単語を簡単に取得できます。
var tokens = ['Apple', 'Banana', 'The' ...];
var text = '';
for (var i=0; i<50; i++) {
text += tokens[Math.floor(Math.random()*tokens.length)];
}
document.getElementById('myDiv').innerHTML = text;
はい、アレイを使用します。このような配列からランダムな単語を取得するには、次を使用します。
function getRandomWord() {
var words = ['Apple','Banana','The','Orange','House','Boat','Lake','Car','And'];
return words[Math.floor(Math.random() * words.length)];
}
次に、その関数を好きな範囲で呼び出します。
var paragraph = [];
for(var i = 0; i < 50; i++)
paragraph.push(getRandomWord());
$('#my-container').text( paragraph.join(' ') );
それは可能であり、ここにそれの迅速で汚い例があります。(申し訳ありませんが、ATMはもうありません)
var words = ['apple', 'beer', 'cake', 'potato', 'orange'],
div = document.getElementById('foo');
for(i = 0; i < 50; i++) {
div.innerHTML += ' ' + words[Math.floor(Math.random() * words.length)];
}
</ p>
はい、すべての単語をに入れてくださいArray
。次に、Fisher-Yatesシャッフルアルゴリズムを適用して、単語配列をシャッフル/ランダム化します。次に、slice
指定したサイズの配列を取得し、それらの単語をHTMLに出力します。
var words = [ "Apple", "Banana", "The", "Orange", "House", "Boat", "Lake", "Car", "And" ];
function fisherYates (arr) {
var n = arr.length;
while (n) {
var j = Math.floor(Math.random() * n--);
var temp = arr[n];
arr[n] = arr[j];
arr[j] = temp;
}
return arr;
}
fisherYates(words); // shuffle
var randomParagraph = words.slice(0, 5).join(" "); // take 5 random words
document.write(randomParagraph);
デモ。</ p>