javascript - リストからランダムな段落を選択

Question

私は現在 Javascript を学んでおり、独自の Lorem Ipsum ジェネレーターを作成したいと考えています。

基本的に、段落のリストを (javascript で、または HTML ドキュメントで) 作成します。

ユーザーがGenerateボタンを押すと、リストから 3 つのランダムな段落が出力されます。

私はここを見回しましたが、実際に役立つものは何も見つかりません。

ありがとう

Answer 1

単純に Javascript 配列を使用して、ランダムなインデックスを選択し、その段落を DOM 要素に挿入することができます。また、以下のコメントに従って、以前のランダムな整数を繰り返さないようにコードを更新しました。

例 (テストされていないコード)

//global to store previous random int
_oldInt = null;

var paragraphArray = ["Lorem ipsum delor...", "The great white...", "Chitty-chitty-bang-bang..."];  

//update element content (e.g. `<div>` with paragraph)
document.getElementById("MyID").innerHTML = pickRandom(paragraphArray);

var pickRandom = function(paragraphArray){
    //random index of paragraphArray
    var randomInt = Math.floor(Math.random()*paragraphArray.length);
    //ensure random integer isn't the same as last
    if(randomInt == _oldInt)
        pickRandom(paragraphArray);
    else{
        _oldInt = randomInt;
        return paragraphArray[randomInt];
    }
}

Answer 2

You need some paragraphs (here, a JavaScript array), a result box (here, a <div>) and a button (here, a... <button>).

When you click on the button, you want to add a paragraphs into the result.

var paragraphs = ['Lorem', 'ipsum', 'dolor', 'sit', 'amet'],
    nbParagraphs = paragraphs.length
    paragraph = null,
    result = document.getElementById('result'),
    button = document.getElementsByTagName('button')[0];

button.addEventListener('click', function() {
    /*
     * Math.random() return a number between 0 and 1
     * parseInt() return an integer (the 10 is here to say that we are in decimal)
     * parseInt(Math.random() * nbParagraphs, 10) return a number between 0 and the number of paragraphs, so we can use it to select a paragraph in the paragraphs array
     */
    paragraph = paragraphs[parseInt(Math.floor(Math.random() * nbParagraphs, 10))]
    result.innerHTML += '<p>' + paragraph + '</p>'
})

Here is a demo.

Answer 3

Math.randomリストからランダムなインデックスを生成するために使用できます。

var paragraphs = [...]; # This is your list of paragraphs

function get_random_paragraph() {
    var index = Math.floor(paragraphs.length * Math.random());
    return paragraphs[index];
};

この式Math.floor(MAX_VALUE * Math.random())はランダムな整数を生成しxます0 <= x < MAX_VALUE。