Javascript jquery$（）和document.getElementById

为什么会这样

var drop = document.getElementById('sidebar-left');
if(drop.addEventListener) {
    drop.addEventListener('dragenter', handleDragover, false);
    drop.addEventListener('dragover', handleDragover, false);
    drop.addEventListener('drop', dropIn, false);
}

有效，但是

var drop = $('sidebar-left')[0];
if(drop.addEventListener) {
    drop.addEventListener('dragenter', handleDragover, false);
    drop.addEventListener('dragover', handleDragover, false);
    drop.addEventListener('drop', dropIn, false);
}

---

不起作用？据我所知，两者都应该工作。

jQuery

$

函数需要CSS选择器，而不是ID

$（'sidebar-left'）

应该是

$（'sidebar-left'）

---

您可能会将其与Prototype.js

$

函数混淆，后者需要一个ID。

jQuery方法无法工作，因为您错过了选择器中的

：

var drop = $('#sidebar-left')[0];

此时，它正试图获取空jQuery对象的DOM元素，该对象将返回

未定义的

要将整个代码段转换为jQuery，请尝试以下操作：

var $drop = $('#sidebar-left');
$drop.on('dragenter', handleDragover);
$drop.on('dragover', handleDragover);
$drop.on('drop', dropIn);

应该是

$（“#左侧边栏”）

和其他答案一样，我的答案也是一样的：jQuery需要一个CSS样式选择器（ref:Sizzle）。但是，需要注意的一点是，如果要按ID（而不是类）查找某个对象，则不需要使用
[0]
，因为它只返回一个对象。除非，你在多个元素上使用相同的ID…但我不认为你会这么做

重述，
$（“#左侧边栏”）

正在尝试查找所有元素，而不是侧边栏左侧id为的元素。是否要

$('#sidebar-left')

$（'sidebar-left'）应该是$（'sidebar-left'）
$（'sidebar-left'）
将查找
的DOM标记作为旁注，首选第一种方法，因为您没有对匹配的元素使用任何jQuery功能。他使用
[0]
提取DOM元素，以便调用
addEventListener
。
$('sidebar-left')

$('#sidebar-left')