在函数执行后更改随机生成的字

Question

我目前正在做一个节目，在这个节目中，你喜欢或不喜欢屏幕上显示的活动。我的问题:我希望随机生成的单词在拇指向下输入被单击或拇指向上输入被单击后发生变化。

以下是我的Javascript代码：

let words = ['Food', 'Video Games', 'Movies', 'Spa', 'Sleeping'];
let word = words[Math.floor(Math.random()*words.length)];

document.getElementById("word").innerHTML = word;

function ai(){
  document.getElementById("liked").innerHTML = "LIKED";
  document.getElementById("disliked").innerHTML = "";
}

function aii(){
  document.getElementById("disliked").innerHTML = "DISLIKED";
  document.getElementById("liked").innerHTML = "";
}

下面是我的HTML代码：

<h1 id="word"></h1>
<h1 id="liked"></h1>
<h1 id="disliked"></h1>
<input type="image" src="thumbsup.png" class="tu" onclick="ai()">
<input type="image" src="thumbsdown.png" class="td" onclick="aii()">

提前感谢！

Answer 1

只需将随机生成转移到函数中。您可以创建一个执行随机生成的函数，然后在onclick函数中调用该函数

​

let words = ['Food', 'Video Games', 'Movies', 'Spa', 'Sleeping'];

function random_generate(){
  let word = words[Math.floor(Math.random()*words.length)];
  document.getElementById("word").innerHTML = word;

}
function ai(){
  random_generate();
  document.getElementById("liked").innerHTML = "LIKED";
  document.getElementById("disliked").innerHTML = "";
}

function aii(){
  random_generate();
  document.getElementById("disliked").innerHTML = "DISLIKED";
  document.getElementById("liked").innerHTML = "";
}

<h1 id="word"></h1>
<h1 id="liked"></h1>
<h1 id="disliked"></h1>
<input type="image" src="thumbsup.png" class="tu" onclick="ai()">
<input type="image" src="thumbsdown.png" class="td" onclick="aii()">

​

Answer 2

只需将随机字的生成变成一个函数，

function generate_random() {
  let word = words[Math.floor(Math.random()*words.length)];
  document.getElementById("word").innerHTML = word;   
}   

然后在脚本的开头或在构造函数中调用此函数(取决于您使用的框架)，然后将函数调用添加到ai()和call ()中。

function ai(){
  document.getElementById("liked").innerHTML = "LIKED";
  document.getElementById("disliked").innerHTML = "";
  generate_random();
}

function aii(){
  document.getElementById("disliked").innerHTML = "DISLIKED";
  document.getElementById("liked").innerHTML = "";
  generate_random();
}

Answer 3

您只在声明时选择了一个随机单词，并且只更改了文本onClick。

您应该创建一个函数来选取随机单词onClick，如下所示：

const pickWord = () => words[Math.floor(Math.random()*words.length)];

function ai(){
  document.getElementById("liked").innerHTML = "LIKED";
  document.getElementById("disliked").innerHTML = "";
  document.getElementById("word").innerHTML = pickWord();
}