不使用jQuery注册JavaScript事件

如何在不使用jQuery的情况下正确执行以下操作

   $(document).ready(function(){
      $("#someButton").click(function(){
        alert("Hello");
      });
   });

谢谢。

最简单的方法是：

// DOM Level 0 way
window.onload = function () {
  document.getElementById("someButton").onclick = function() {
    alert("Hello");
  };
};

这将适用于所有浏览器，但请注意，使用这种方法只能将一个事件处理程序附加到事件

还要注意，

onload

事件并不完全等同于jQuery的

ready

事件，

onload

将在页面的所有资源（图像、子帧等）完全加载时触发，而

ready

将在解析DOM后立即触发

如果要附加多个事件处理程序，可以使用标准方法（或IE）

获取跨浏览器方式绑定事件的最简单抽象是：

function addEvent(el, eventType, handler) {
  if (el.addEventListener) { // DOM Level 2 browsers
    el.addEventListener(eventType, handler, false);
  } else if (el.attachEvent) { // IE <= 8
    el.attachEvent('on' + eventType, handler);
  } else { // ancient browsers
    el['on' + eventType] = handler;
  }
}

还要注意，

addEventListener

和IE的

attachEvent

方法有它们的不同之处，当您使用

addEventListener

将多个处理程序附加到事件时，它们将以相同的顺序启动，因为处理程序被绑定（FIFO），

attachEvent

将以相反顺序（后进先出）触发处理程序

---

检查一个例子。

像这样的东西怎么样

document.getElementById（'someButton'）。onclick=function（）{alert（'Hello'）；}

尝试以下方法：

测试点击
函数setClicks（）{
var元素=document.getElementById（'test'）；
element.onclick=function（）{
警报（“测试”）；
}
}
测试

没有jQuery，这个答案就不那么简单了，因为有两种主要的连接事件的样式（取决于您使用的浏览器）。如果不使用这两种样式中的一种，则事件可能会相互覆盖。以下是更简单/覆盖的样式：

window.onload = function() {
    document.getElementById("someButton").onclick = function() {
        alert("Hello");
    }
}

但如果您尝试并重复上述两次，您将只收到一个警报，因为第二次将覆盖第一次。或者，您可以执行一些浏览器/功能检测，然后使用特定浏览器的特定事件机制；有关该款式的更多信息，请访问QuirksMode.com：

---

据我所知，onLoad与DOM Ready不同

On Load等待加载所有资产（图像、其他外部文件）。 而在DOM Ready上，只等待HTML被呈现，而不等待资产被加载

如果我错了，请纠正我。

TL；DR

在现代浏览器上：

<input type="button" id="someButton" value="Some Button">
<script>
document.getElementById("someButton").addEventListener("click", function() {
    alert("Hello");
}, false);
</script>

没有Jquery？用什么语言？！？jquery不是一种语言。PS：使用javascript。谢谢。正确且简单的回答：将脚本放在used元素之后-最简单-就在

之前…查看jQuery 1.4.2代码是的，它不是完全等效的，但是它们使用onload作为捕捉正确事件的最后机会：//返回window.onload，这将始终在window.addEventListener（“load”）中起作用，jQuery.ready，false）；“这不应该是一个被接受的答案，所以我投了反对票。它没有显示文档的等效内容。准备好了，海报解释说，但这应该是一个评论，而不是答案，对不起。。。

<input type="button" id="someButton" value="Some Button">
<script>
document.getElementById("someButton").addEventListener("click", function() {
    alert("Hello");
}, false);
</script>