javascript - JavaScript - 乱数/変数を動的ハイパーリンクに挿入しますか?

Question

これは私の最初の HTML JavaScript です。ランダムな知的/神秘的な記事を検索するために、半ランダムな単語と数字を含む JavaScript でランダムな HTML リンクを生成したいと考えています。

例えば：

• グーグル検索「ウィキ生まれ（乱数1400～1850）」 >>> ポスト暗黒時代の伝記をランダムに探す

• google検索「説明不能(乱数1900 1930)」 >>> ランダムな説明不能事象を探す

Answer 1

ページの読み込み時に乱数を使用してランダムなリンクを生成する場合:

var searches = [
    ['Wiki Born', 1400, 1850, 'post dark ages biography'],
    ['unexplained', 1900, 1930, 'unexplained event']
];
var google = "http://www.google.com/search?q=";

function getRand(min, max) {
    return min + Math.floor(Math.random() * (max-min));
}

window.onload = function() {
    // get random search item
    var item = searches[getRand(0, searches.length)];

    // get random number based on the selected item
    var randnum = getRand(item[1], item[2]);

    // put together the google link, replace spaces with + sign
    var searchlink = (google + item[0] + ' ' + randnum).replace(/\s+/g, '+');
    console.log(searchlink);

    // put together the html tag
    var html = '<a href="'+searchlink+'" target="_blank">Find random '+item[3]+'</a>';
    console.log(html);

    document.body.innerHTML = html;
};

ページの読み込み時にすべてのリンクを独自の乱数で表示する場合は、ループを追加します。

// for each search item
for(i=0; i<searches.length; i++) {
    var item = searches[i];

....

各リンクがクリックされるたびに異なる番号を生成するようにしたい場合は、別のアプローチを取ることができます。

<script>
function getRand(min, max) {
    return min + Math.floor(Math.random() * (max-min));
}

window.onload = function() {
    // get all links in the #randomlinks div
    var links = document.getElementById('randomlinks').getElementsByTagName('a');

    // for each search item
    for(i=0; i<links.length; i++) {

        // set a click handler
        links[i].onclick = function() {

            // get random number based on data attributes
            var min = parseInt(this.getAttribute('data-min'), 10);
            var max = parseInt(this.getAttribute('data-max'), 10);
            var randnum = getRand(min, max);

            // append random number to end of link
            this.href = this.href.replace(/\+[0-9]*$/, '+'+randnum);
        };
    }
};
</script>
<div id="randomlinks">
    <a href="http://www.google.com/search?q=Wiki+Born+" data-min="1400" data-max="1850" target="_blank">Find random post dark ages biography</a><br>
    <a href="http://www.google.com/search?q=unexplained+" data-min="1900" data-max="1930" target="_blank">Find random unexplained event</a>
</div>