Javascript 我很难找出我的html和js文件有什么问题。我需要数一数元音

我需要为一个类修复这段代码，我已经修复了很多东西，但我不确定为什么它不起作用。它应该计算短语中元音的数量，并将其作为警报返回。当我点击按钮时，什么也没有出现

这是html。它工作正常，但在我遗漏某些内容时会添加它

元音
数元音
在此处键入短语：
计算元音（a、e、i、o、u）

这里是JS。它似乎没有注册代码末尾的“打开.单击”

函数countVowels（）{
变量文本框，短语，i，丰满，字母，元音计数；
textBox=document.getElementById（'textBox'）；
短语=textBox.value；
短语=短语.toLowerCase（）；
元音计数=0；
对于（i=0；i
问题是
window.onload=init（）
，在这里调用
init
方法，并将
init
返回的值指定为
onload
回调。因此，当调用
init
方法时，
countBtn
尚未添加到dom中，导致类似
uncaughttypeerror的错误：无法将属性“onclick”设置为null

您真正想要的是在
load
事件上调用
init
，因此需要将对
init
函数的引用传递到
onload

应该是

window.onload = init;

演示：
请注意，输入元素没有结束标记。
function countVowels() {
    var textBox, phrase, i, pLength, letter, vowelCount;
    textBox = document.getElementById('textBox');
    phrase = textBox.value;
    phrase = phrase.toLowerCase();
    vowelCount = 0;
    for (i = 0; i < phrase.length; i += 1) {
        letter = phrase[i];
        if (letter === 'a' || letter === 'e' || letter === 'i' || letter === 'o' || letter === 'u') {
            vowelCount++;
        }
    }

    alert(vowelCount + ' vowels');
    var outArea = document.getElementById('outputDiv');
    outArea.innerHTML = vowelCount + ' vowels in ' + phrase;
}

function init() {
    alert('init vowels');
    var countTag = document.getElementById('countBtn');
    countTag.onclick = countVowels;
}

window.onload = init();

window.onload = init;