jQuery中执行$('.myclass').show()时选择器返回null会出现什么情况？

当使用jQuery选择器未匹配到任何DOM元素时，不会抛出运行错误，对应的链式方法会静默不执行。

以如下代码为例：

$('.myclass').show();

jQuery选择器的返回值永远是jQuery实例对象，不会返回null。调用show()这类实例方法时，会优先判断当前实例包含的DOM元素数量，若长度为0则直接结束方法执行，不会产生任何额外操作。

如果将上述逻辑直接改写为原生JavaScript，代码如下：

document.querySelector('.myclass').style.display = 'block';

原生document.querySelector方法在未匹配到对应元素时会返回null，此时尝试访问null的style属性会直接抛出类型错误，打断后续代码的运行。

若需要在原生JavaScript中实现和jQuery一致的安全调用效果，可以增加非空判断逻辑：

const target = document.querySelector('.myclass');
if (target) {
  target.style.display = 'block';
}

内容的提问来源于stack exchange，提问作者alancc