JQuery發現返回undefined

Question

有人可以解釋爲什麼我得到這種行爲？

jQuery中，如果我跑

var $('div#form-container').click(function() { 
    label = $(this).find('form label')[0]; 
    console.log(label); 
}); 

我得到

<label class=​"control radio">​ 
    " One " 
    <input type=​"radio" name=​"profile" value=​"one"> 
    <span class=​"control-indicator">​</span>​ 
</label>​ 

但如果我再嘗試獲得

var input = label.find('input'); 

返回undefined。

我如何獲得它返回我的input元素？爲什麼find找不到input，因爲它是label的後裔？

非常感謝！

Answer 1

爲什麼找不到輸入，因爲它是標籤的後代？

因爲.find()方法只針對jQuery對象，而您試圖將其綁定在本地DOM節點上$(this).find('form label')[0];返回DOM元素而不是jQuery對象。

所以當你申請find()的方法就會造成錯誤。

---

這是一個DOM節點：

var label = $(this).find('form label')[0]; // it's a dom node 

，你必須使用jQuery對象：

var input = $(label).find('input'); 

---

如果你想在表單中的第一個標籤，然後

你可以使用.first(), :first, .eq(0), :eq(0) etc.比如：

var label = $(this).find('form label').first(); 
var input = label.find('input'); // returns the element now 

Answer 2

在這裏，您將標籤作爲dom元素而不是jQuery元素，因此無法使用find。

var input = $(label).find('input'); 

或者

沒有轉換的jQuery元素DOM在聲明中，你找到標籤

var label = $(this).find('form label'); 

Answer 3

不能使用DOM元素來訪問其他的DOM元素的元素，你需要或者ID或類來獲得這樣的特定元素，

var input = $('.control radio').find('input'); 

或

var input = $('label').find('input'); 
console.log(input);