Как я могу проверить объект jQuery?

В 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, который я могу вставить в консоль. Так что с тех пор что-то определенно изменилось.

Ответы

Ответ 1

Я верю, что этот сайт описывает то, что вы ищете, но подытоживая (по ссылке):

Интересная вещь о jQuery объект состоит в том, что, хотя его тип данных объект, он имеет подобный массиву характеристики:

  • его имена свойств (те, которые относятся к элементам DOM, по крайней мере) Числовой
  • имеет свойство length

И: $('div').toSource(); Изменить: Работает только в FF Должно быть то, что вы хотите для отображения свойств объекта.

Для Chrome: alt text

В принципе, вы переходите в Javascript Console в Chrome. Перейдите на вкладку "Сценарии" (# 1). Поместите точку останова на том месте, где вы хотите проверить код (# 2). Затем запустите script и, когда он сломается на этом месте, проверьте переменные области видимости (# 3). В частности, раздел __proto__.

Ответ 2

Это не отвечает на ваш вопрос очень удовлетворительным образом, но может помочь вам, в зависимости от того, что вам нужно:

Я заметил, что если вы сделаете объект менее "похожим на массив", то Chrome будет записывать его так же, как для объекта без массива (т.е. с расширяемым деревом свойств).

Один из способов сделать его менее массивным - предоставить свойство length нечисловое значение:

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

p.s. Вероятно, вы захотите вернуть объект length обратно к исходному значению перед его повторным использованием.

Ответ 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), затем в консоли вы увидите, что ваш объект будет красивой структурой типа node, которую вы сможете посмотреть на всех уровнях глубины. Попробуйте

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