Pourquoi Google Chrome a-t-il une sortie console.log () différente via jQuery?

Quand j'journal de la console d'un objet jquery par exemple.

var s = $("#item");
console.log(s);

- Je obtenir quelque chose comme ceci

[div#item, context: document, selector: "#item", jquery: "1.9.1", constructor: function, init: function…]

Je me souviens d'avant ( il y a un mois environ ), je voudrais obtenir quelque chose comme:

 [<div id="item">pas</div>]

Est ce changement dans Chrome lui-même? Ou il y a un changement de jquery? Ou j'ai fait quelque chose pour rendre la sortie regarder différemment

Je trouve cette deuxième sortie beaucoup plus facile à lire et je peux survoler, et il a marqué sur la page. Maintenant, je reçois trop d'infos, c'est assez dur à lire

source d'informationauteur Zokora

  1. 1

    Ce que je pense que vous avez remarqué la différence entre l'évaluation d'un objet jQuery dans la console et de l'afficher avec console.log(). À l'aide de David Thomas violondéfinissez un point d'arrêt sur la console.log déclaration. Quand il s'arrête au point d'arrêt, type $s dans la console et vous verrez

    [<div id="item">pas</div>]

    Continuer, et vous verrez détaillé de l'objet imprimé par console.log().

    Je ne suis pas vraiment sûr de ce que jQuery ou Chrome fait que les causes de cette différence. La sortie lorsque vous tapez $s semble être le résultat de $s.toArray()tandis que console.log() montre le véritable objet jQuery.

    Preuve de plus que ce n'est pas nouveau comportement-j'ai juste lié à une double question à partir de novembre.

  2. 1

    essayer...

    var s = $("<div>").append($("#item").clone()).html();

console.log(s);

$(s).remove();

    Il n'est pas dans sa plus belle forme, mais le résultat est ce que vous cherchez et je suis sûr que vous pourriez venir avec une bonne fonction...

    Fondamentalement, je suis de la création d'un div, en mettant une copie de #item, et le rejet de la div à l'innerHTML à la console pour afficher l'intégralité de l' #item élément. (Et pas seulement de #l'élément de innerHTML)
    Puis-je détruire s à nettoyer.

  3. 1

    Oui il peut y avoir un changement avec jquery, vérifiez la façon dont ils sont maintenant affaire avec les objets dom dans la version 1.9.1

    http://jsfiddle.net/5HJ3L/1/

    si vous essayez de l' console.log de cette manière

    var s = $("#item");
console.log(s);

    la sortie sera comme

    [div#item, context: document, selector: "#item", jquery: "1.9.1", constructor: function, init: function…]
0: div#item
context: document
length: 1
selector: "#item"
__proto__: Object[0]

    si vous vérifiez attentivement, vous trouverez la sortie requise dans le tableau ci-dessus à la clé 0de sorte que la sortie de la ligne suivante sera

    console.log(s[0]);

    De sortie:

    <div id="item">pas</div>

    aussi, si vous l'essayer sans jquery, la sortie sera celui qui vous sont nécessaires

    var e = document.getElementById('item');
console.log(e);

    De sortie:

    <div id="item">pas</div>

    PS: ce n'est pas une suggestion à l'encontre de jquery, mais de montrer comment ils seront face par google-chrome

    Correction: Également noter que la sortie de mentionner dans la question est dans array forme que les moyens que j'ai proposé est en string

  4. 1

    Vous pouvez contrôler le style de la sortie d'un journal de la console de sortie avec c console de style.journal: https://developers.google.com/web/tools/chrome-devtools/console/console-write#styling_console_output_with_css

    Par exemple, pour mettre avec un simple élément du dom style:

    console.log("%o", document.body)
  5. 0
    var s = $("#item").html();
console.log(s)
  6. 0

    J'ai obtenu le résultat attendu pour la console de l'envoi de l'élément du DOM et de ne pas le jquery.

    console.log($("div")[0])
  7. -1
        if div value printed on div .. then plz menstion html(). 

    var s = $("#item").html();

    console.log(s);