Javascript 在一个页面中包含两次的脚本中调用函数

今天，我读了一个关于的问题。我创建了一个小项目来测试这一点，通过单击一个链接调用一个函数中的一个简单警报。我使用jquery帮助我将事件处理程序绑定到click，如下所示：

<p>
   <a id="TestLink">Click here</a>
</p>

案例1

<p>
   <a id="TestLink">Click here</a>
</p>

Javascript:

$(document).ready(function () {
    $("#TestLink").click(function() {
        alert("Message");
    });
});

<p>
   <a id="TestLink">Click here</a>
</p>

function showMessage() {
    alert("Message");
}

Html:

<p>
   <a id="TestLink">Click here</a>
</p>

Html:

<p>
   <a id="TestLink">Click here</a>
</p>

点击这里

<p>
   <a id="TestLink">Click here</a>
</p>

当我点击链接时，消息只显示一次，即使我包含了两次脚本

<p>
   <a id="TestLink">Click here</a>
</p>

我的问题：

<p>
   <a id="TestLink">Click here</a>
</p>

在案例1中，当多次添加同一脚本时，如何完成两次绑定事件处理程序的过程？我只想知道当同一个脚本被多次添加时，事件挂钩的更多细节；文章、参考文献等

<p>
   <a id="TestLink">Click here</a>
</p>

---

在案例2中，浏览器如何解决必须选择用于调用函数的脚本的冲突？

在第一种情况下，事件绑定两次。有时这样做是可取的。如果希望在一个div上执行一个click事件，而在同一个div上执行另一个不相关的click事件，则可能希望两个函数都执行。这就是为什么两个单击事件都会触发，并且调用函数的原因。在这种情况下，调用两次的是同一个函数！在事件上绑定两个函数的有用场景示例：

<p>
   <a id="TestLink">Click here</a>
</p>

您可能想知道用户是否处于活动状态。网站上的单击事件 身体会告诉你的。但是，如果覆盖处于活动状态，则需要 移除覆盖层。这两个函数都在单击事件时执行 身体

<p>
   <a id="TestLink">Click here</a>
</p>

在第二种情况下，您在javascript的第一个包含中声明的函数将被第二个javascript中的相同函数覆盖。第一份声明已经不见了。因此，该函数只调用一次：

<p>
   <a id="TestLink">Click here</a>
</p>

var test = function() {
  alert('first one!');
}
var test = function() {
  alert('second one!');
}
test(); // second one!

---

+1.情况2没有需要解决的冲突；showMessage的第二个声明覆盖了第一个声明，因此javascript引擎只有一个showMessage可供选择。