2012-05-13 71 views
3

我想在Chrome的Javascript控制檯中學習調試Javascript。但是,我不明白控制檯如何顯示對象的數據類型。例如,在JavaScript控制檯,它顯示了這一點:如何識別變量的對象類型?

enter image description here

在這張圖片中,我使用的JQuery。我試圖對幾個變量做一個console.log,但是我怎麼知道一個特定的變量是一個JQuery對象還是一個原始的DOM對象?是HTMLDivElement還是另一個顯示控制檯中列出的div標記的JQuery對象或原始DOM對象?

通常,我應該如何在調試器控制檯(如Chrome的Javascript控制檯)中瞭解Javascript中的對象或變量的數據類型?在諸如Java這樣的語言中,變量的數據類型在調試器中清晰地顯示出來;我可以從調試器知道變量是什麼類型的對象,無論是Class A的實例還是Class B的實例等。

+2

如果您確實想要檢查對象的屬性,請使用'console.dir'。 –

+1

@naveen實際上,在我編輯我的問題之前,我真的很想問一下在調試過程中如何檢查Javascript的數據類型。但我沒有一個更具體的例子來用於我的問題。我只能想到JQuery和DOM對象的情況。所以我認爲我這樣說。 – Carven

+0

@xenon。好。對不起,我不能撤消我的投票,我猜。 – naveen

回答

4
if (variable instanceof jQuery) // Or variable.jquery 
    // jQuery object. 

Live DEMO

instanceof文檔:

instanceof運算測試對象是否在其原型鏈有一個構造的原型屬性。


方式jQuery的檢查DOM元素是與nodeType

// Handle $(DOMElement) 
if (selector.nodeType) { 

方式的jQuery檢查jQuery對象是與jquery屬性:

// HANDLE: $(expr, $(...)) 
else if (!context || context.jquery) { 
+0

爲什麼不'if(elm.jquery)'爲jQuery對象而'if(elm.nodeType)'爲DOM對象? :) – naveen

+1

@naveen。你可以... – gdoron

+0

+1:即使它是一個重複的問題,你給OP另一種方法:) – naveen

3

這些都是jQuery對象。

控制檯將它們識別爲包含DOM元素的類似數組的對象。上MDN

0

可以查看在調試器中的類型,如果你去腳本選項卡。
然後下監視表達式+標誌選擇合適的媒體,並添加任何你喜歡的。
inspector

0

JQuery對象實際上是DOM元素的數組,Weile DOM元素只是DOM元素。