Afficher la liste de toutes les variables JavaScript dans la console Google Chrome

Dans Firebug, l'onglet DOM affiche une liste de toutes vos variables et objets publics. Dans la console de Chrome, vous devez saisir le nom de la variable ou de l'objet public que vous souhaitez explorer.

Existe-t-il un moyen - ou au moins une commande - pour la console de Chrome d'afficher une liste de toutes les variables et objets publics? Cela économisera beaucoup de frappe.

Est-ce le type de sortie que vous recherchez?

for(var b in window) { 
  if(window.hasOwnProperty(b)) console.log(b); 
}

Cela listera tout ce qui est disponible sur l' windowobjet (toutes les fonctions et variables, par exemple, $et jQuerysur cette page, etc.). Cependant, c'est tout à fait une liste; Je ne sais pas à quel point c'est utile ...

Sinon, faites-le windowet commencez à descendre dans son arbre:

window

Cela vous donnera DOMWindowun objet extensible / explorable.

Lorsque l'exécution du script est arrêtée (par exemple, sur un point d'arrêt), vous pouvez simplement afficher tous les globaux dans le volet droit de la fenêtre des outils de développement:

Ouvrez la console puis entrez:

• keys(window) pour voir les variables
• dir(window) voir des objets

L' windowobjet contient toutes les variables publiques, vous pouvez donc le taper dans la console, puis le développer pour afficher toutes les variables / attributs / fonctions.

Si vous souhaitez exclure toutes les propriétés standard de l'objet fenêtre et afficher les globaux spécifiques à l'application, cela les imprimera sur la console Chrome:

(function(){var standardGlobals=["top","window","location","external","chrome","document","inlineCSS","target","width","height","canvas","data","DOMURL","img","svg","ctx","url","w","a","speechSynthesis","webkitNotifications","localStorage","sessionStorage","applicationCache","webkitStorageInfo","indexedDB","webkitIndexedDB","crypto","CSS","performance","console","devicePixelRatio","styleMedia","parent","opener","frames","self","defaultstatus","defaultStatus","status","name","length","closed","pageYOffset","pageXOffset","scrollY","scrollX","screenTop","screenLeft","screenY","screenX","innerWidth","innerHeight","outerWidth","outerHeight","offscreenBuffering","frameElement","clientInformation","navigator","toolbar","statusbar","scrollbars","personalbar","menubar","locationbar","history","screen","postMessage","close","blur","focus","ondeviceorientation","ondevicemotion","onunload","onstorage","onresize","onpopstate","onpageshow","onpagehide","ononline","onoffline","onmessage","onhashchange","onbeforeunload","onwaiting","onvolumechange","ontimeupdate","onsuspend","onsubmit","onstalled","onshow","onselect","onseeking","onseeked","onscroll","onreset","onratechange","onprogress","onplaying","onplay","onpause","onmousewheel","onmouseup","onmouseover","onmouseout","onmousemove","onmouseleave","onmouseenter","onmousedown","onloadstart","onloadedmetadata","onloadeddata","onload","onkeyup","onkeypress","onkeydown","oninvalid","oninput","onfocus","onerror","onended","onemptied","ondurationchange","ondrop","ondragstart","ondragover","ondragleave","ondragenter","ondragend","ondrag","ondblclick","oncuechange","oncontextmenu","onclose","onclick","onchange","oncanplaythrough","oncanplay","oncancel","onblur","onabort","onwheel","onwebkittransitionend","onwebkitanimationstart","onwebkitanimationiteration","onwebkitanimationend","ontransitionend","onsearch","getSelection","print","stop","open","showModalDialog","alert","confirm","prompt","find","scrollBy","scrollTo","scroll","moveBy","moveTo","resizeBy","resizeTo","matchMedia","requestAnimationFrame","cancelAnimationFrame","webkitRequestAnimationFrame","webkitCancelAnimationFrame","webkitCancelRequestAnimationFrame","captureEvents","releaseEvents","atob","btoa","setTimeout","clearTimeout","setInterval","clearInterval","TEMPORARY","PERSISTENT","getComputedStyle","getMatchedCSSRules","webkitConvertPointFromPageToNode","webkitConvertPointFromNodeToPage","webkitRequestFileSystem","webkitResolveLocalFileSystemURL","openDatabase","addEventListener","removeEventListener","dispatchEvent"];
    var appSpecificGlobals={};
    for (var w in window){
        if (standardGlobals.indexOf(w)==-1) appSpecificGlobals[w]=window[w];
    }
    console.log(appSpecificGlobals);})()

Le script fonctionne bien comme un bookmarklet. Pour utiliser le script comme bookmarklet, créez un nouveau signet et remplacez l'URL par ce qui suit:

javascript:(function(){var standardGlobals=["top","window","location","external","chrome","document","inlineCSS","target","width","height","canvas","data","DOMURL","img","svg","ctx","url","w","a","speechSynthesis","webkitNotifications","localStorage","sessionStorage","applicationCache","webkitStorageInfo","indexedDB","webkitIndexedDB","crypto","CSS","performance","console","devicePixelRatio","styleMedia","parent","opener","frames","self","defaultstatus","defaultStatus","status","name","length","closed","pageYOffset","pageXOffset","scrollY","scrollX","screenTop","screenLeft","screenY","screenX","innerWidth","innerHeight","outerWidth","outerHeight","offscreenBuffering","frameElement","clientInformation","navigator","toolbar","statusbar","scrollbars","personalbar","menubar","locationbar","history","screen","postMessage","close","blur","focus","ondeviceorientation","ondevicemotion","onunload","onstorage","onresize","onpopstate","onpageshow","onpagehide","ononline","onoffline","onmessage","onhashchange","onbeforeunload","onwaiting","onvolumechange","ontimeupdate","onsuspend","onsubmit","onstalled","onshow","onselect","onseeking","onseeked","onscroll","onreset","onratechange","onprogress","onplaying","onplay","onpause","onmousewheel","onmouseup","onmouseover","onmouseout","onmousemove","onmouseleave","onmouseenter","onmousedown","onloadstart","onloadedmetadata","onloadeddata","onload","onkeyup","onkeypress","onkeydown","oninvalid","oninput","onfocus","onerror","onended","onemptied","ondurationchange","ondrop","ondragstart","ondragover","ondragleave","ondragenter","ondragend","ondrag","ondblclick","oncuechange","oncontextmenu","onclose","onclick","onchange","oncanplaythrough","oncanplay","oncancel","onblur","onabort","onwheel","onwebkittransitionend","onwebkitanimationstart","onwebkitanimationiteration","onwebkitanimationend","ontransitionend","onsearch","getSelection","print","stop","open","showModalDialog","alert","confirm","prompt","find","scrollBy","scrollTo","scroll","moveBy","moveTo","resizeBy","resizeTo","matchMedia","requestAnimationFrame","cancelAnimationFrame","webkitRequestAnimationFrame","webkitCancelAnimationFrame","webkitCancelRequestAnimationFrame","captureEvents","releaseEvents","atob","btoa","setTimeout","clearTimeout","setInterval","clearInterval","TEMPORARY","PERSISTENT","getComputedStyle","getMatchedCSSRules","webkitConvertPointFromPageToNode","webkitConvertPointFromNodeToPage","webkitRequestFileSystem","webkitResolveLocalFileSystemURL","openDatabase","addEventListener","removeEventListener","dispatchEvent"]; var $appSpecificGlobals={};for (var w in window){if (standardGlobals.indexOf(w)==-1) $appSpecificGlobals[w]=window[w];} window.$appSpecificGlobals=$appSpecificGlobals;console.log(window.$appSpecificGlobals);})()

David Walsh a une bonne solution pour cela. Voici mon point de vue à ce sujet, combinant sa solution avec ce qui a également été découvert sur ce fil.

https://davidwalsh.name/global-variables-javascript

x = {};
var iframe = document.createElement('iframe');
iframe.onload = function() {
    var standardGlobals = Object.keys(iframe.contentWindow);
    for(var b in window) { 
      const prop = window[b];
      if(window.hasOwnProperty(b) && prop && !prop.toString().includes('native code') && !standardGlobals.includes(b)) {
        x[b] = prop;
      }
    }
    console.log(x)
};
iframe.src = 'about:blank';
document.body.appendChild(iframe);

x a maintenant seulement les globaux.

Tapez l'instruction suivante dans la console javascript:

debugger

Vous pouvez maintenant inspecter la portée globale à l'aide des outils de débogage normaux.

Pour être honnête, vous obtiendrez tout dans la windowportée, y compris les navigateurs intégrés, il pourrait donc s'agir d'une expérience d'aiguille dans une botte de foin. : /

Vous voudrez peut-être essayer cette extension Firebug lite pour Chrome.

Pour afficher une variable dans Chrome, allez dans "Sources", puis "Regarder" et ajoutez-la. Si vous ajoutez ici la variable "window", vous pouvez la développer et l'explorer.

Méthode mise à jour du même article mentionné par Avindra - injecte iframe et compare ses contentWindowpropriétés aux propriétés de fenêtre globales.

(function() {
  var iframe = document.createElement('iframe');
  iframe.onload = function() {
    var iframeKeys = Object.keys(iframe.contentWindow);
    Object.keys(window).forEach(function(key) {
      if(!(iframeKeys.indexOf(key) > -1)) {
        console.log(key);
      }
    });
  };
  iframe.src = 'about:blank';
  document.body.appendChild(iframe);
})();

Type: this dans la console,

pour obtenir le window objectje pense (?), je pense que c'est essentiellement la même chose que la frappewindow dans la console.

Cela fonctionne au moins dans Firefox et Chrome.

Comme toutes les "variables publiques" sont en fait des propriétés de l'objet fenêtre (de la fenêtre / onglet que vous regardez), vous pouvez simplement inspecter l'objet "fenêtre" à la place. Si vous avez plusieurs cadres, vous devrez de toute façon sélectionner l'objet fenêtre correct (comme dans Firebug).

Essayez cette commande simple:

console.log (fenêtre)

Lister la variable et ses valeurs

for(var b in window) { if(window.hasOwnProperty(b)) console.log(b+" = "+window[b]); }

Afficher la valeur d'un objet variable particulier

console.log(JSON.stringify(content_of_some_variable_object))

Sources: commentaire de @ northern-bradley et réponse de @ nick-craver