jQuery的基本結構

Question

我想明白這行的意思：

var oViewport = { obj: $('.viewport', root) }; 

這是一個線路輸出插件tinyscrollbar的。有人可以向我解釋這一行的價值嗎？我真的尋找答案，但沒有找到答案。我感謝您的幫助。

Answer 1

變量oViewport定義爲對象{obj: ...};這個對象內部obj密鑰的值是.viewport在可變root的上下文中，灒選擇器（選擇內部root變量，該變量，通常，一些DOM元素太。

Answer 2

它創建的對象常量和受讓人與viewport類的所有的DOM元素它到名爲oViewport變量：

var oViewport = {}; //Empty object literal 

該對象具有一個屬性，命名爲obj，其值是一個jQuery對象：

var oViewport = { obj: $() }; //Property with jQuery object as value 

jQuery對象找到所有具有類「視口」的元素，它們是root是的後代。 root是用於選擇器的上下文：

$(".viewport", root); //Select all .viewport elements within root 

Answer 3

1. $('.viewport', root) 
     => this finds all elements having class viewport with context as root. 

2. { obj: $('.viewport', root) }; 
     => creating a object literal with "obj" as property 
         and the elements objects found above as value. 

3. var oViewport = { obj: $('.viewport', root) }; 
      => assigning the created object literal to variable "oViewport". 

Answer 4

var oViewport = { obj: $('.viewport', root) }; 

在該代碼是使用object literal語法（例如{ key: value }）被創建的對象，並分配給新變量oViewport。

的對象有一個鍵或屬性，「obj」，它的價值是在與參數'.viewport和root稱爲命名$作用的結果。

因爲這是jQuery的，$是主要jQuery selector function，而在這種情況下它的選擇與CSS類「視」 DOM元素，但只有那些對象root（叫的孩子「中，」這可能本身是一個DOM元素）。

上面的代碼大致類似於下面：

var selector   = '.viewport', 
    selectedElements = $(selector, root), 
    oViewport  = new Object() // equivalent to oViewport = {} 
; 

oViewport['obj'] = selectedElements; // equiv. to oViewport.obj = selectedElements;