Question

在jQuery 1.4.4中，如果我在Google Chrome控制台中执行此操作：

var divs = $('div');

...我得到的东西似乎是一个DOM元素数组。但我知道它必须是一个jQuery对象，因为我可以链接jQuery方法：

divs.hide('slow').show('slow'); // etc

我想看到的是jQuery对象，.fn属性列出了它的所有方法等等。我很确定我曾经能够看到它。

如果我创建自己的对象，就像这样：

var foo = {species: 'marmot', flavor: 'lemon'}

...我可以在控制台中挖掘它的属性。

如何在控制台中检查jQuery对象？

此外，正在做些什么来使它看起来像一个数组？

更新 - 它确实改变了

如果我加载旧版本的jQuery - 例如，请在空白标签中将其复制并粘贴到我的控制台中：

http://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js

......然后我这样做：

var divs = $('div');

...我确实回到jQuery.fn.jQuery.init，我可以在控制台中深入了解。从那以后，事情发生了一些变化。

Answer 1

我相信this site详细描述了您正在寻找的内容，但总结（来自链接）：

关于jQuery的有趣之处   对象是，虽然它的数据类型是   一个对象，它有类似数组   特性：


其属性名称（至少引用DOM元素的属性名称）为
  数字

它有一个长度属性

并且：$('div').toSource(); 编辑仅适用于FF
应该是您想要显示对象属性的内容。

对于Chrome： alt text

基本上，您可以转到Chrome中的Javascript控制台。单击Scripts选项卡（＃1）。在要检查代码的位置放置断点（＃2）。然后运行脚本，当它在那个位置中断时，检查范围变量（＃3）。特别是__proto__部分。

Answer 2

这不能以令人满意的方式回答您的问题，但它可能对您有所帮助，具体取决于您所追求的目标：

我注意到如果你使对象不像“数组一样”，那么Chrome会像对待非数组对象一样记录它（即使用可扩展的属性树）。

使其不像数组一样的一种方法是给length属性一个非数字值：

var divs = $('div');
divs.length = "foo";
console.log(divs);

P.S。在再次使用它之前，您可能希望将对象的length恢复为原始值。

Answer 3

我在网上发现了这次检查功能，从未回头。它不是jQuery：/

function inspect(obj, maxLevels, level)
{
  var str = '', type, msg;

    // Start Input Validations
    // Don't touch, we start iterating at level zero
    if(level == null)  level = 0;

    // At least you want to show the first level
    if(maxLevels == null) maxLevels = 1;
    if(maxLevels < 1)     
        return '<font color="red">Error: Levels number must be > 0</font>';

    // We start with a non null object
    if(obj == null)
    return '<font color="red">Error: Object <b>NULL</b></font>';
    // End Input Validations

    // Each Iteration must be indented
    str += '<ul>';

    // Start iterations for all objects in obj
    for(var property in obj)
    {
      try
      {
          // Show "property" and "type property"
          type =  typeof(obj[property]);
          str += '<li>(' + type + ') ' + property + 
                 ( (obj[property]==null)?(': <b>null</b>'):('')) + '</li>';

          // We keep iterating if this property is an Object, non null
          // and we are inside the required number of levels
          if((type == 'object') && (obj[property] != null) && (level+1 < maxLevels))
          str += inspect(obj[property], maxLevels, level+1);
      }
      catch(err)
      {
        // Are there some properties in obj we can't access? Print it red.
        if(typeof(err) == 'string') msg = err;
        else if(err.message)        msg = err.message;
        else if(err.description)    msg = err.description;
        else                        msg = 'Unknown';

        str += '<li><font color="red">(Error) ' + property + ': ' + msg +'</font></li>';
      }
    }

      // Close indent
      str += '</ul>';

    return str;
}

另外console.log（obj）很酷，但我最近发现了另一个很酷的功能。尝试console.dir（obj），然后在控制台中你会看到你的obj将是一个很好的小节点类型结构，你将能够查看所有深度级别。试试

console.dir(String)
// or  
obj = {'this' : 'that', 'one' : [2,3,4,5], 'A' : {} }; console.dir(obj)

我如何检查jQuery对象？

更新 - 它确实改变了

3 个答案: