Javascript 如何在JS中顺序调用函数？

我正在制作一个网页，一旦用户单击开始按钮，页面的CSS就会发生一些变化（我编写了所需的JavaScript（JS）代码）。只有在这些变化发生之后，我才希望其他一些变化发生。为了实现这一点，我在事件发生后被调用的函数中编写了两个函数的调用：（在下面的JS代码中，由“click”事件触发的函数中开始调用的两个函数是-startCountdown和showWords）

在showWords功能中，我还希望对页面进行一些更改。但是，我希望只有在startCountdown函数完全执行后才能执行它。现在，当我运行上述代码时，只要我单击按钮，警报就会弹出但我不想让它发生

我需要做哪些更改

（在showWords函数完全执行后-我希望再执行一个函数-这样我希望函数按顺序执行-即更改必须按特定顺序进行。）

谢谢你的帮助

---

附言：如果你不能理解我的问题，请告诉我。

所以当它像这样被称为clearInterval时

document.getElementById（“开始按钮”）.addEventListener（“单击”，开始游戏）；
函数启动游戏（）
{
var contentSlides=document.getElementsByClassName（“幻灯片”）；
//游戏开始了，所以我们隐藏了开始幻灯片！
contentSlides[0].classList.add（“hideDisplay”）；
//
//现在将显示“321开始！”下降计时器！
contentSlides[1].classList.remove（“hideDisplay”）；
startCountdown（document.getElementById（“onClickCount”）//
}
功能启动计数（reqElement）
{
var时间=2；
var intervalId=setInterval（函数（）
{ 
reqElement.innerText=时间；
如果（时间==0）{
clearInterval（intervalId）；
reqElement.innerText=“开始！”
showWords（）；
}
时间--；
},1000);
}
函数showWords（）
{
警惕（“嗨！”）；
}

所以当它像这样被称为clearInterval时

document.getElementById（“开始按钮”）.addEventListener（“单击”，开始游戏）；
函数启动游戏（）
{
var contentSlides=document.getElementsByClassName（“幻灯片”）；
//游戏开始了，所以我们隐藏了开始幻灯片！
contentSlides[0].classList.add（“hideDisplay”）；
//
//现在将显示“321开始！”下降计时器！
contentSlides[1].classList.remove（“hideDisplay”）；
startCountdown（document.getElementById（“onClickCount”）//
}
功能启动计数（reqElement）
{
var时间=2；
var intervalId=setInterval（函数（）
{ 
reqElement.innerText=时间；
如果（时间==0）{
clearInterval（intervalId）；
reqElement.innerText=“开始！”
showWords（）；
}
时间--；
},1000);
}
函数showWords（）
{
警惕（“嗨！”）；
}

是，因为asnychronous javascript是这样的：如果调用普通函数和异步函数，它们不是顺序依赖的，因此需要第一个函数来调用第二个函数。。答案已经给出了，因为asnychronous javascript是这样的，如果您调用普通函数和异步函数，它们不是顺序依赖的，所以您需要第一个函数来调用第二个函数。。答案已经给出了

document.getElementById("startButton").addEventListener("click",startTheGame);
function startTheGame()
{
    var contentSlides = document.getElementsByClassName("slide");
    // Game started so we are hiding the start slide!
    contentSlides[0].classList.add("hideDisplay"); 
    //
    // Now the "321 Go!" down timer is to be shown!
    contentSlides[1].classList.remove("hideDisplay");
    startCountdown(document.getElementById("onClickCount"));
    showWords();
    //
}
function startCountdown(reqElement)
{
    var time = 2;
    var intervalId = setInterval(function ()
    { 
        reqElement.innerText = time; 
        if(time==="Go!")
            clearInterval(intervalId);
        time-=1; 
        if(time===0)
            time = "Go!";
    },1000);
}
function showWords()
{
    alert("Hi!");
}