Javascript 从外部脚本调用ID的按钮

Javascript 从外部脚本调用ID的按钮,javascript,Javascript,我试图编写一个游戏,当点击按钮时调用外部.js脚本。代码按照我希望的方式工作,但我有点困惑如何将输出转换为HTML,以便正确格式化。每当单击按钮时,该按钮应重新启动该过程,即无需重新加载页面,以便进行新的随机选择 我最终还想包括一个按钮,以删除最后显示的项目,但这是为以后 Javascript: var basket = ['apple', 'banana', 'cherry', 'durian', 'eggplant', 'fig', 'grapes', 'huckleberry', 'kiw

我试图编写一个游戏,当点击按钮时调用外部.js脚本。代码按照我希望的方式工作,但我有点困惑如何将输出转换为HTML,以便正确格式化。每当单击按钮时,该按钮应重新启动该过程,即无需重新加载页面,以便进行新的随机选择

我最终还想包括一个按钮,以删除最后显示的项目,但这是为以后

Javascript:

var basket = ['apple', 'banana', 'cherry', 'durian', 'eggplant', 'fig', 'grapes', 'huckleberry', 'kiwi', 'lemon', 'mango'];

function randOrd(){
return (Math.round(Math.random())-0.5); } 

mixedBasket = basket.sort( randOrd ); //randomize the array

var i = 0;  // the index of the current item to show

fruitDisplay = setInterval(function() {            
document
    .getElementById('fruit')
    .innerHTML = mixedBasket[i++];    // get the item and increment
if (i == mixedBasket.length) i = 0;   // reset to first element if you've reached the end
}, 70);  //speed to display items

var endFruitDisplay = setTimeout(function( ) { clearInterval(fruitDisplay); }, 3000); 
//stop display after x milliseconds
当前的HTML显然运行代码,但它在单击按钮之前启动

HTML:


提前感谢您的帮助

您的setInterval调用不在函数内部,因此当下载并执行.js文件时,它会立即执行该方法。最简单的解决方案是将对setInterval的调用封装在函数中,然后在按钮的onClick事件中调用该函数。

谢谢!我已经用头撞了两天了。如果这回答了你的问题,请把它标记为更正左边的空复选标记。谢谢
<head><script type="text/javascript" src="Fruitpicker3.js"></script></head>
<body>
<span id = "fruit"> </span>
<input type="button" onclick="fruit" value="Start"/>
</body>
</html>