我试图构建一个随机的JS单词列表生成器,但我在这里的代码只生成一个单词。实际上,我希望它能够从之前给出的列表中生成30个单词的列表,它可以是60个单词列表或700个单词,但结果应该总是30个,没有重复的单词,但我不知道如何实现这个目标。用JS生成随机单词列表
另外,我想观众介绍自己的单词列表,然后点击“生成字的新列表”,然后页面会随机给他们的30个字有不同的顺序列表,他们每次点击按钮。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="language" content="english">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title></title>
<style type="text/css">
form {
float:left;
padding:20px 20px 10px;
border:1px solid #999;
}
label {
float:left;
width:100px;
line-height:22px;
margin-bottom:10px;
font-size:12px;
}
input {
margin-bottom:10px;
}
</style>
<script type="text/javascript">
function init(){
words0=['art','car','bus','earth','camera','phone','sun','light','number',];
df=document.forms[0];
df.reset();
df[1].onclick=function() {
rnd0=Math.floor(Math.random()*words0.length);
df[0].value=words0[rnd0];
}
}
window.addEventListener?
window.addEventListener('load',init,false):
window.attachEvent('onload',init);
</script>
</head>
<body>
<form action="#">
<div>
<label>word one:</label><input type="text" readonly="readonly"><br>
<input type="button" value="Click here to get random words">
<input type="reset" value="Clear">
</div>
</form>
</body>
</html>
顺便说一句,更好地摆脱像'words0'或''rnd0'变量rnd1'名.. –
要从一个较大的集合中挑选n个随机项目,[shuffle](https://en.wikipedia.org/wiki/Fisher%E2%80%93Yates_shuffle),然后取第一个'n'项目。 – Phylogenesis
然后你必须迭代,每次检查新的随机单词是否不在你生成的单词列表中,并且这样做直到你有30个单词。类似于:do var newWord = Math.floor(Math.random()* words0.length); if(wordsArr.indexOf(newWord)=== -1){wordsArr.push(newWord); counter ++;} } while(counter <30); – user2520818