扬声器1:现在在这最后一个例子, 记得,我们穿插了一些 JavaScript代码我的HTML里面, 具体而言,里面的价值 要求提交的属性 对于表单标签。 现在的小页面,这 不是什么大不了的。 但作为一个网页变得更长,更 复杂的,简单地把你的 JavaScript代码在这里和那里里面 的属性的值是不 最好的设计。 最好的,如果我们的因素,并出 至少把它的内部 script标签集中。 如何做到这一点? 好吧,让我们回到我的表单标签和 先删除这个属性和它 重视完全。 然后在这里,而不是限定 函数调用打招呼,让我们挂在 到的代码行,最终我们 仍然要执行和替换 在迎接功能如下。 Document.get元素通过ID 引用引文演示 - 在那里演示,召回,是独一无二的 标识符形式本身 - 点上提交,这是召回的名字 事件处理程序,其中 我们感兴趣。 而且我们指派的提交处理程序 值这实际上是一个 函数本身。 现在请注意,我不是真正 这里调用一个函数。 我不是定义一个匿名的, 否则称为lambda函数, 这些大括号之间指定 一串代码,应该 其实是可以执行的。 特别是,我想代码 执行是行,我有 前,然后让我们添加到 返回false,因此,这种形式是不 最终提交到结束远程Web 在传统方式的服务器。 现在让我们保存这个文件,打开它 在浏览器中,并看看会发生什么。 http://localhost/dom-1.html。 现在,让我们输入我的名字, 大卫提交。 并没有什么似乎已经发生了 除了我的网页的URL似乎 已经改变,就好像形式是 实际提交到同一个文件。 现在为什么会这样呢? 嗯,我需要一些更多的信息。 因此,让我们去进取,不断开拓Chrome的 开发者工具,这样我实际上可以 看在控制台窗口中看到 如果我做错了什么事。 我可以访问通过 一对夫妇的方式。 其中之一就是通过这个菜单在这里, 然后在工具,然后下降到 开发者工具。 并注意在这里的控制台选项卡, 有一个未捕获的错误类型,不能 在提交空的设置属性。 现在为什么会这样呢? 以及早在我的源代码在这里,通知 上提交,我认为是一个 其元素的属性 唯一标识符是演示。 一个元件,同样,仅仅是 在树中的节点。 这样看来,我的浏览器不 认为该元素 或节点存在呢。 而事实上,它没有。 回想一下,一个网页被解析或读 通过一个网络浏览器,从上到下, 左到右。 所以当JavaScript代码是 遇到的,典型地,它的执行 的时候了。 但在这种情况下,我们甚至还没有得到 但对DOM的一部分, HTML中,在该表格具有独特的 标识符演示已被宣布。 因此,我们正在努力执行我的 该节点之前的JavaScript代码甚至 存在于树的,当然,是 有问题的,因为那么可以肯定, 元素本身将是空的 在该时间点。 因此,如何解决? 那么,我们有几个解决方案。 但是,让我们通过重新尝试最简单的 从我的头上脚本标签 标记为我的身体,但具体而言,对 我的网页的本体的底部,以便 它的节点下方 和问题。 具体地讲,让我们突出和切 开放的标记和脚本结束标记 和重新定位的代码,整幢 这里的文件的底部。 现在这不一定是最干净的 设计的,但至少它会 执行操作的正确顺序。 让我们保存文件, 重新在我的浏览器。 让我们刷新页面,重新输入我的名字, 还有,您好大卫又回来了。