DOM就绪香草javascript不工作

我的CS老师坚持所有的JS必须放在

标签中，而不是放在其他地方。他还坚持说，我们只使用普通javascript，不使用任何库。因此，为了符合要求，我创建了以下表单，并附带了JS来验证它。问题是，当包装在状态更改检查器中时，它不起作用。我的代码在下面

HTML

---

现在，只要我将脚本放在页面底部，就可以了，而不必将整个过程包装在函数中并调用submit方法。有人能帮我理解为什么它不能以这种方式工作吗？

j

超出了表单的

提交范围。要将它与内联事件处理程序一起使用，它必须是全局的，因此不能在事件侦听器中声明它

改为：

var j;
// Mozilla, Opera, Webkit 
if (document.addEventListener) {
    document.addEventListener("DOMContentLoaded", function () {
        document.removeEventListener("DOMContentLoaded", arguments.callee, false);
        j = new domReady();

    }, false);

    // If IE event model is used
} else if (document.attachEvent) {
    // ensure firing before onload
    document.attachEvent("onreadystatechange", function () {
        if (document.readyState === "complete") {
            document.detachEvent("onreadystatechange", arguments.callee);
            j = new domReady();

        }
    });
}

每次浏览器看到一个
标记时，它都会运行它。当您在
中加载
script.js
时，它会运行它，并尝试查找尚未解析的
，因此仍然不存在。因此，您的
userid
和
pas
变量将是
未定义的

要使代码保持在
上并按预期方式工作，必须在DOM就绪时运行代码

实现这一点的简单方法是定义一个回调，该回调将在加载文档后触发，如：

window.onload = domReady;

你的cs老师不是傻瓜人们还在表单上使用清除按钮吗？不管为了什么？最好的做法是将脚本标记放在页面的末尾以确保加载DOM吗？回顾一下我对我的CS老师的个人看法，对眼前的问题有什么想法吗？当然，这是一种方法。但并不总是最好的。在你知道（至少是一些）替代方案之前，你没有任何立场去争论优点或复杂性。学习其他选择，在你完成教育后，你永远不能使用它们。公平地说，我会在讨论中避免使用解释性语言，以促进有用的对话，但有人知道为什么这样做不起作用吗？事实证明，这就是答案，我感谢你的帮助。我仍然不太明白addEventListener是如何工作的，因为我从未使用过它。请原谅我傲慢地认为有一种正确的方法可以做到这一点。我的CS老师也没有教我们如何做这件事，这是令人沮丧的事情：如果你在一个函数内声明一个变量，它在该函数外是不可见的。您将向addEventListener传递一个函数。这是问题的根源。
var j;
// Mozilla, Opera, Webkit 
if (document.addEventListener) {
    document.addEventListener("DOMContentLoaded", function () {
        document.removeEventListener("DOMContentLoaded", arguments.callee, false);
        j = new domReady();

    }, false);

    // If IE event model is used
} else if (document.attachEvent) {
    // ensure firing before onload
    document.attachEvent("onreadystatechange", function () {
        if (document.readyState === "complete") {
            document.detachEvent("onreadystatechange", arguments.callee);
            j = new domReady();

        }
    });
}

window.onload = domReady;