JQuery通過ID選擇vs document.GetElementByID

我剛剛開始使用JQuery，並通過tutorial vid工作。在某一時刻，演示者將使用JavaScript代替JQuery選擇器。只是想知道爲什麼下面的javascript getElementById在將對象傳遞給函數時工作正常，但第二個不行？JQuery通過ID選擇vs document.GetElementByID

謝謝！

// works 
addTask(document.getElementById('taskText'), evt); 

// doesn't 
addTask($('#taskText'), evt);

來源

2011-08-12 Glinkot

現在我們需要去猜測什麼的'addTask'，右：

認爲它是從零開始的數組，你可以通過這樣的DOM元素通過？ – zerkms

我的想法是它沒有什麼區別 - 它接受一個對象和一個事件。我可以發佈它。 – Glinkot

顯然，如果你的函數確實接受一個對象，並且不接受另一個對象 - 那麼問題是與該函數;-) – zerkms

getElementById()返回DOM元素引用。

jQuery的選擇器返回一個jQuery對象。您可以使用

$('#taskText').get(0);

見http://api.jquery.com/get/

來源

2011-08-12 04:45:00 Phil

謝謝你。我不知道DOM和Jquery對象之間是有區別的。謝謝！ – Glinkot

$('#taskText')返回一個jQuery對象引用得到jQuery對象的元素引用。

document.getElementById('taskText')返回一個DOM元素引用。

如果你的addTask()函數不知道如何將它們轉換爲它所需要的，那麼這將是問題，因爲它們中的一個將需要轉換。

如果你想從jQuery對象第一個DOM元素的引用，你可以用這個做：

$('#taskText').get(0)

所以這兩個應該是相同的：

$('#taskText').get(0) 
document.getElementById('taskText')

來源

2011-08-12 04:45:26 jfriend00

謝謝，聽起來不錯。 – Glinkot

爲了增加另一個答案，關於結果，如果你想使用jQuery（這更容易閱讀），你可以直接得到dom節點，如下所示：

addTask($('#taskText')[0], evt);

來源

2011-08-12 04:46:26 OverZealous

+1忘了那個。它也在'get（）'page – Phil

感謝那Overzealous。 – Glinkot

兩者都不是完全相同

document.getElementById('taskText'); //returns a HTML DOM Object 

var contents = $('#taskText'); //returns a jQuery Object 

var contents = $('#taskText')[0]; //returns a HTML DOM Object

所以你必須改變它來獲取HTML DOM對象

addTask($('#taskText')[0], evt);

來源

2011-08-12 04:47:16

感謝pramendra – Glinkot

由於@Phil和@ jfriend00人士指出，的document.getElementById（ 'taskText'）是一個DOM元素和$（'＃taskText'）是一個jQuery對象。後者是與選擇器匹配的所有DOM元素的對象。

addTask($('#taskText')[0], evt);

來源

2011-08-12 04:49:45 Ruxta

爲什麼投下了票？解釋會更合適 – Ruxta

只是在這裏猜測，但你所有的答案是備份其他答案。這可能是一個評論，說「+1」 – Phil

當我寫這些時，這些評論沒有發佈。也許我會給他們+1更快的打字技巧;） – Ruxta

JQuery通過ID選擇vs document.GetElementByID

回答

相關問題