如果调用了Javascript事件侦听器而缺少目标元素,会发生什么情况?

如果调用了Javascript事件侦听器而缺少目标元素,会发生什么情况?,javascript,javascript-events,jquery,Javascript,Javascript Events,Jquery,目前,我们正在从Rails项目的单个common.js文件加载站点范围的事件侦听器。我们意识到其中涉及的大多数权衡,并正试图减轻它们。一旦我们的基本架构站稳脚跟,我们可以通过控制器或视图将它们移动到单独的文件中 目前,快速的问题是我们如何才能在必要时激活它们,这就引出了一个扭曲的伪禅宗问题: 如果一个事件监听器是在一个林中声明的,而周围没有人听到它,它还会发出声音吗 换句话说,如果在javascript中为给定页面声明一个基本侦听器,即没有任何持久性元素像.live或.delegate那样,并且

目前,我们正在从Rails项目的单个common.js文件加载站点范围的事件侦听器。我们意识到其中涉及的大多数权衡,并正试图减轻它们。一旦我们的基本架构站稳脚跟,我们可以通过控制器或视图将它们移动到单独的文件中

目前,快速的问题是我们如何才能在必要时激活它们,这就引出了一个扭曲的伪禅宗问题:

如果一个事件监听器是在一个林中声明的,而周围没有人听到它,它还会发出声音吗

换句话说,如果在javascript中为给定页面声明一个基本侦听器,即没有任何持久性元素像.live或.delegate那样,并且目标元素实际上不存在于该给定页面上,那么除了用于评估它和检查元素的DOM的几个周期之外,是否真的发生了任何事情?它在内存中是否处于活动状态,正在寻找该元素?还有别的吗?它似乎从不抛出错误,这很有趣,因为在其他上下文中,这样的调用会生成null/nil/invalid类型的错误

例如:

  $(document).ready(function () {
      $('#element').bind('blur keyup', function);
    }
假设该元素不存在。真的发生了什么事吗?此外,将其包裹在预滤器中是否更好,如:

  $(document).ready(function () {
    if ($('#element')) {
      $('#element').bind('blur keyup', function);
    }
或者,浏览器中的.js解释器是否足够聪明,可以忽略在$document.ready中不存在的元素上声明的基本侦听器?我们是否应该声明上面的初始简单表单,并保持不变,或者首先检查元素是否可以节省一些宝贵的资源和/或避免一些我们没有看到的隐藏错误?还是我错过了另一个角度


谢谢

JQuery设计用于处理0+个选定元素。 如果未选择任何元素,则不会发生任何事情

请注意,在使用jQuery选择器时,您永远不会得到null。例如:

$('#IDontExist') // != null
$('#IDontExist').length === 0 // true (it's ajQuery object with 
                              //       zero selected elements).
报告说:

如果没有元素与提供的选择器匹配,则新jQuery对象为空;也就是说,它不包含任何元素,并且.length属性为0


JQuery设计用于处理0+个选定元素。 如果未选择任何元素,则不会发生任何事情

请注意,在使用jQuery选择器时,您永远不会得到null。例如:

$('#IDontExist') // != null
$('#IDontExist').length === 0 // true (it's ajQuery object with 
                              //       zero selected elements).
报告说:

如果没有元素与提供的选择器匹配,则新jQuery对象为空;也就是说,它不包含任何元素,并且.length属性为0

$'element'如果结果为空集,那么jQuery将不会执行任何操作

由于jQuery总是返回一个对象,我们也可以在空集上调用方法,但在内部,它会在应用其逻辑之前进行检查

即使要在附加事件处理程序之前检查元素是否存在,也可以使用jQuery对象的length属性

if ($('#element').length > 0) {
    $('#element').bind('blur keyup', function);
}
$'element'如果结果为空集,那么jQuery将不会执行任何操作

由于jQuery总是返回一个对象,我们也可以在空集上调用方法,但在内部,它会在应用其逻辑之前进行检查

即使要在附加事件处理程序之前检查元素是否存在,也可以使用jQuery对象的length属性

if ($('#element').length > 0) {
    $('#element').bind('blur keyup', function);
}

与此相关的是,我发现了一种在几乎任何上下文中分离侦听器和其他脚本的美丽而优雅的方法,仅仅基于body类:但这并没有回答我最大的问题,这只是:当调用侦听器时,元素丢失了,到底发生了什么,我发现了一种漂亮而优雅的方法,可以在几乎任何上下文中简单地基于body类来分离侦听器和其他脚本:但这并不能回答我最大的问题,那就是:当调用侦听器时,元素丢失了,到底发生了什么?完美的答案。谢谢您知道如果我们使用传统的javascript事件处理程序,而不使用JQuery来丢弃不匹配的选择器会发生什么吗?@XMLilley。放弃选择器是什么意思?无论如何,空jQuery对象上的任何jQuery函数都不会做任何事情。没有错误或操作。@XMLilley:使用传统的javascript事件处理程序,无法绑定到未定义的元素,因为像getElementById这样的选择器函数如果不在页面中,将返回未定义的元素,因此您需要执行var el=document.getElementByIdx;ifeleventcode@David穆德:那就是我想要的。谢谢@西米利。哦,那他说的…:完美答案。谢谢您知道如果我们使用传统的javascript事件处理程序,而不使用JQuery来丢弃不匹配的选择器会发生什么吗?@XMLilley。放弃选择器是什么意思?无论如何,空jQuery对象上的任何jQuery函数都不会做任何事情。没有错误或操作。@XMLilley:使用传统的javascript事件处理程序,无法绑定到未定义的元素,因为像getElementById这样的选择器函数如果不在页面中,将返回未定义的,因此
您需要执行var el=document.getElementByIdx;ifeleventcode@David穆德:那就是我想要的。谢谢@西米利。哦,那他说的…:if$'element'似乎也适用于我,而不是if$'element'.length,还是我遗漏了什么?我不知道为什么要尝试它,但我只是假设它会像Python中那样工作。我经常看到使用.length的模式。这在本质上更好,还是对人们来说更直观?正如我在回答中提到的,jQuery总是返回一个对象,即使它找不到任何元素。ifobject将始终通过,这就是它为您工作的原因。如果您真的想检查元素是否存在,那么使用length属性,它将给出jQuery找到的元素数。啊哈!空数组和对象是真实的,而空字符串是虚假的。是的,空字符串会导致错误的情况。如果$'element'似乎也适用于我,而不是if$'element'。length,或者我缺少什么?我不知道为什么要尝试它,但我只是假设它会像Python中那样工作。我经常看到使用.length的模式。这在本质上更好,还是对人们来说更直观?正如我在回答中提到的,jQuery总是返回一个对象,即使它找不到任何元素。ifobject将始终通过,这就是它为您工作的原因。如果您真的想检查元素是否存在,那么使用length属性,它将给出jQuery找到的元素数。啊哈!空数组和对象是真实的,而空字符串是虚假的。是的,空字符串会导致错误的情况。