2011-03-21 41 views
1

我读的jQuery在行动匹配的DOM元素的数组一个特殊的JavaScript对象,和第6页它说

的$()函数返回一个特殊的JavaScript对象,其中包含与选择器匹配的 DOM元素数组。

'特殊',我想它是什么意思是它返回一个jQuery对象。 但是我正努力去理解这句话的最后部分:“一组DOM元素”。

问:你能为我写一个返回“DOM元素数组”的函数吗?

例如:$('p')将返回所有p标签。因此,如果不从头开始编写jQuery,您能否以JavaScript代码向我展示,确切地说,当作者将它称为“DOM元素数组”时会返回什么?

难道仅仅包含字符串,例如各元素的数组:

<p>foot</p> 
<p>bar</p> 

我知道萤火虫的,但我担心的是Firebug的可能解释是返回什么,并表示这对我。我想我正在试图了解DOM元素究竟是什么。

回答

1

该数组是DOM元素。每个DOM元素本身就是一个对象,具有子/父母/属性等。

在DOM几乎总结起来维基文章的第一句:

 
The Document Object Model (DOM) is a cross-platform and language-independent convention 
for representing and interacting with objects in HTML, XHTML and XML documents. 
Aspects of the DOM (such as its "Elements") may be addressed and manipulated within 
the syntax of the programming language in use. The public interface of a DOM is 
specified in its application programming interface (API).

http://en.wikipedia.org/wiki/Document_Object_Model

+0

这是什么意思? – 2011-03-21 01:33:25

+0

这意味着它不是一个字符串数组 - 它是一个对象数组。每个对象都是特定类型(“p”,“a”,“tr”等),具有单独的属性,方法和事件。 DOM本身就是一个由浏览器组成的一组对象。就JS而言,它们都从“Object”的基础对象继承。 justkt发布的链接似乎是JavaScript类型的公平入门书。 – iivel 2011-03-21 01:43:18

+0

iivel,谢谢! – 2011-03-21 20:10:45

2

它并不真的返回一个数组,而是一个像对象这样的数组(jQuery有toArray()来创建一个真正的数组)。

我说数组像,因为它有一个length属性,并包含与数字键匹配的元素。

现实对象返回了(只是仅举几例)...

  • 所有jQuery方法(这样他们就可以在一组被称为)。
  • 集合中的数字键控元素。
  • length财产。
  • 使用选择器。
  • jQuery版本。
  • 等...
1

尝试console.log(document.getElementsByTagName('p')),请注意,返回你的HTML:

[<p>foot</p>, <p>bar</p>] 

现在尝试$('p'),并注意它返回同样的事情。所以如果有一个原生的Javascript函数,jQuery将使用它,但如果没有,那么它包含$()选择器中的方法来创建相似的数组。要访问数组,您可以使用数组符号,如$('p')[0],如果您想为第一个<p>标记解开DOM HTMLElement。

区别在于$()选择器也包含所有的jQuery方法,但是一旦你“展开”了一个元素,它就会丢失这些方法。因此,要获得第一个元素但保留jQuery包装器,您应该使用$('p').eq(0)这种方式,您仍然可以使用类似$('p').eq(0).css('background-color','#ff0000')而不是写入的方法$('p')[0].style.backgroundColor = '#ff0000'

+1

'$('p')'和'document.getElementsByTagName('p')'的结果不一样(尽管它们可能包含相同的元素)。 – alex 2011-03-21 01:23:45

1

jQuery中的$()函数实际上返回一个jQuery对象。您可以在documentation中阅读更多关于它的内容。 jQuery对象就像一个数组(它有一个长度属性,例如),尽管它不是一个数组。 jQuery对象可能是空的,或者它可能包含一组匹配选择器的已包装DOM元素。 DOM元素是Javascript type