web-dev-qa-db-ja.com

Google ChromeコンソールのすべてのJavaScript変数のリストを表示する

Firebugでは、DOMタブにすべてのパブリック変数とオブジェクトのリストが表示されます。 Chromeのコンソールでは、探索したいパブリック変数またはオブジェクトの名前を入力する必要があります。

Chromeのコンソールにすべてのパブリック変数とオブジェクトのリストを表示する方法、または少なくともコマンドを入力する方法はありますか？それは多くの入力を節約するでしょう。

javascriptgoogle-chromegoogle-chrome-devtools
212
GRboss

これはあなたが探している種類の出力ですか？

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

これはwindowオブジェクトで利用可能なすべてのものを一覧表示します（このページの$やjQueryなど、すべての関数と変数など）。しかし、これはかなりのリストです。それがどれほど役に立つのかわからない...

それ以外の場合はwindowを実行してツリーの下に移動してください。

window

これはあなたにDOMWindowという、展開可能/探査可能なオブジェクトを与えるでしょう。

285
Nick Craver

スクリプトの実行が停止されたとき（ブレークポイントなど）は、[開発者ツール]ウィンドウの右側のペインにすべてのグローバルを表示するだけです。

chrome-globals

68
Marcel Korpel

コンソールを開き、次のように入力します。

  • 変数を見るためのkeys(window)
  • オブジェクトを見るためのdir(window)
53
arkadiusm

windowオブジェクトにはすべてのパブリック変数が含まれているため、コンソールに入力してから展開すると、すべての変数/属性/関数を表示できます。

chrome-show-all-variables-expand-window-object

36
Fabien Ménager

ウィンドウオブジェクトのすべての標準プロパティを除外し、アプリケーション固有のグローバルを表示する場合は、これらが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);})()

このスクリプトはブックマークレットとしてもうまく機能します。スクリプトをブックマークレットとして使用するには、新しいブックマークを作成してURLを次のように置き換えます。

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);})()
30
Max Heiber

David Walshはこのためのいい解決法を持っています。これが私の考えであり、彼の解決策とこのスレッドで発見されたことを組み合わせています。

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はグローバルのみを持つようになりました。

7
Avindra Goolcharan

Chrome用のこの Firebug lite 拡張機能を試してみてください。

4
KooiInc

同じ 記事からメソッドを更新しました Avindraが言及した - iframeを注入し、そのcontentWindowプロパティをグローバルウィンドウプロパティと比較します。

(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);
})();
4
jmsmrgn

変数をクロムで表示するには、[ソース]に移動してから[ウォッチ]して追加します。ここに "window"変数を追加すれば、それを展開して探索することができます。

3
TigerBear

JavaScriptコンソールに次の文を入力します。

debugger

これで、通常のデバッグツールを使ってグローバルスコープを調べることができます。

公平を期すために、ブラウザ組み込みを含むwindowスコープの everything を取得するので、ちょっとした不幸な経験になるかもしれません。 ：/

3
tangentstorm

すべての「パブリック変数」は実際には（見ているウィンドウ/タブの）ウィンドウオブジェクトのプロパティなので、代わりに単に「ウィンドウ」オブジェクトを調べることができます。複数のフレームがある場合は、とにかく正しいウィンドウオブジェクト（Firebugのように）を選択する必要があります。

1
mihi

入力：コンソールでthis、

window objectを取得するには（？）、基本的にコンソールでwindowと入力するのと同じだと思います。

少なくともFirefoxとchromeで動作します。

1
Sebastian Norr

enter image description here

1
GRboss

この簡単なコマンドを試してください。

console.log（ウィンドウ）
1
Vaclav Muller