原生js实现随机点餐效果

一款十分简单的原生js实现的随机点菜代码，点击点菜按钮随机点取上面菜单的菜品，可根据需求改成自己需要功能，比如说随机点名。感兴趣的朋友来参考实现代码吧

html:

css:

 .wrap{ width: 500px; height: 400px; margin: 0 auto; text-align: center; } #box{ width: 100%; height: 300px; border: 1px solid red; text-align: center; line-height: 300px; font-size: 30px; margin-bottom: 20px; }

js:

 var arr = ['宫保鸡丁', '糖醋里脊', '红烧带鱼', '牛腩煲', '红烧肉']; var start = document.getElementById("start"), stop = document.getElementById("stop"), box = document.getElementById("box"), timer = null; start.onclick = function(){ timer = setInterval(function(){ var index = Math.floor(Math.random()*arr.length); box.innerHTML = arr[index]; }, 100) } stop.onclick = function(){ clearInterval(timer); }

效果：