这段代码在Javascript中的含义是什么

这段代码在Javascript中的含义是什么,javascript,Javascript,我是Javascript新手,我很难正确理解这段代码的含义。我想分享一下我对代码的想法,我需要你的指导来正确理解它 <body> <form> <input type="button" value="Click Me!" id="say_hi" /> </form> <script type="text/javascript" src="js_event_01.js"></script> </bod

我是Javascript新手,我很难正确理解这段代码的含义。我想分享一下我对代码的想法,我需要你的指导来正确理解它

<body>
  <form>
    <input type="button" value="Click Me!" id="say_hi" />
  </form>
  <script type="text/javascript" src="js_event_01.js"></script>
</body>

function hi_and_bye() {
  window.alert('Hi!');
  window.alert('Bye!');
 }
var hi_button = document.getElementById("say_hi");
hi_button.onclick = hi_and_bye;

函数hi_和_bye(){
window.alert('Hi!');
window.alert('Bye!');
}
var hi_button=document.getElementById(“say_hi”);
hi_button.onclick=hi_and_bye;

我的理解是:“onclick”事件在ID为“get\u alerts”时调用函数“hi\u and\u bye”。类似地,这可以应用于任何事件,我可以为任何元素提供一个id属性,该id将负责生成一个可访问的相应输入元素

你的理解是正确的。您可以为任何DOM元素提供
id
,而不仅仅是输入。然后使用
getElementById
可以检索对此元素的引用

在本例中,您正在执行以下操作:

// Get a reference to a DOM element that has id="say_hi"
var hi_button = document.getElementById("say_hi");

// subscribe to the onclick event handler of the DOM element we retrieved on  
// the previous line and attach this handler to the hi_and_bye javascript function
hi_button.onclick = hi_and_bye;

我不认为函数体本身需要更多的解释:当这个函数执行时,它只会一次接一次地显示两个警报。

js\u event\u 01.js文件中的内容是什么?尽管看起来,该文件不会影响代码中的任何内容。不,它确实会产生影响。当我点击按钮时,它会显示三个警报。是什么让您认为它没有做任何事情?我在document.getElementById(“say_hi”)中通过打印看到的是一个引用,您已经将该引用分配给调用onclick事件的变量。我感到困惑的是事件处理程序和输入类型之间的关系。我们总是这样处理事件处理程序和输入之间的关系吗?不,不总是。但这是正确的方法,因为您已将javascript与标记分离。您还可以在标记中指定
onclick
事件处理程序:
。现在您不再需要2行javascript代码。但我不建议您像这样使用处理程序的内联赋值。是的,我在书中看到了这种方式。我需要澄清事件应用于输入元素的唯一内容,并且可以通过上述两种方法访问。是的,事件处理程序将应用于输入元素的
onclick
事件。好的,我已经得到了它。到目前为止,我已经澄清了我的概念。非常感谢您的回答和回复。祝你好运