我在JavaScript中有一个赋值来获取一个随机数,并显示没有问题的随机数。我怎么必须将数组附加到随机数以显示与该随机数匹配的相同数量的项目。我的问题来自正确显示奇数个数组项。例如,如果我的随机数是7,我将只从阵列中获得6个项目。我该怎么做才能解决这个问题?
这是我的代码:
var randomNum=Math.floor((Math.random()*9) + 6);
var amenities = ['Pool', 'Bowling Alley', 'Indoor Pool', 'Jacuzzi', 'Private Jacuzzi', 'Rooftop Hot tub', 'Indoor Putt Putt', 'Golf Driving Range',
'Live Music', 'Restaurant', 'Bar', 'Adult Entertainment', 'Free WiFi', 'Stocked Room Bar', 'Unlimited Room Calling']
var list = document.getElementsByTagName('ul')[1];
for (var i = 1; i < randomNum ; i++){
var newItemLast = document.createElement('li');
var newTextLast = document.createTextNode(amentities[i]);
newItemLast.appendChild(newTextLast);
list.appendChild(newItemLast);
var newItemFirst = document.createElement('li');
var newTextFirst = document.createTextNode(amentities[i]);
newItemFirst.appendChild(newTextFirst);
list.insertBefore(newItemFirst, list.firstChild);
i++;
}
var listItems = document.querySelectorAll('li');
var heading = document.querySelector('h2');
var headingText = heading.firstChild.nodeValue;
//var totalItems = listItems.length;
var newHeading = headingText + '<span> ' + randomNum + '</span>';
heading.innerHTML = newHeading;
答案 0 :(得分:1)
正如@Barmar所说 - 你可以使用array.slice(0,random_number),但是你可以看到最新情况,我做了一个样本作为一个直接的javascript for loop
迭代数组为as许多项目作为随机数,并将<li>
附加到显示列表中。
请注意,因为数组是零索引,for循环将提供与您生成的随机数一样多的数组项。这意味着在你所陈述的7作为随机数的例子中 - 以下将给你7项 - 索引为0 - 所以它将是数组中的项0,1,2,3,4,5,6 - 或者换句话说 - 从索引0开始到索引6结束的7个项目。
另外 - 作为一个教学时刻 - 我将随机数传递给第二个允许显示数组项的函数 - 这可以完全在同一个函数中完成 - 但只是为了让你习惯于将值传递给其他函数 - 我认为看到这个任务实际上是两个(随机数的生成和数组到该子集的切片)会很有用。
var array = ['item 1 ', 'item 2', 'item 3 ', 'item 4', 'item 5 ', 'item 6', 'item 7 ', 'item 8', 'item 9', 'item 10'];
function setNum() {
var ranNum = Math.floor(Math.random() * 10);
document.getElementById('displayNum').textContent="The random Number chosen = " + ranNum;
setDisplay(ranNum)
}
function setDisplay(num) {
document.getElementById('displayList').innerHTML = '';
for(i = 0; i < num; i++){
document.getElementById('displayList').innerHTML +='<li>' + array[i]+ '</li>';
}
}
<button type="button" onclick="setNum()">Click Me</button>
<hr/>
<p id ="displayNum"></p>
<ul id="displayList"></ul>