web-dev-qa-db-ja.com

Chrome開発者ツールを使用してJavascriptを編集する

Chromeのデベロッパーツールを使用して、サイトでJavaScriptを編集しようとしています。これを行う方法について約30のアカウントを読み、いくつかのビデオを見ました。実際、[ソース]タブに移動して、編集するファイルを開くと、何もできません。私が逃しているステップはありますか？

ブレークポイントの作成、ステップスルーなどができます。編集することはできません。この機能は最近削除されましたか？

javascriptgoogle-chromeweb-developer-toolbar
80
cooperia

私はこの質問が古いことを知っていますが、同様の問題があり、解決策を見つけました。

ファイルがプリティファイされている場合、Chromeは編集を許可しません。私はそれをオフにし、編集することができました。これがあなたの問題である/あったことを賭けたい。

88
raddevon

[ソース]タブの開発者ツールでjavascriptを編集できますが、独自のファイルでのみJavaScriptを編集できます。 HTML（またはPHP）ファイルに埋め込まれたスクリプトは読み取り専用のままです。

48
welah

いくつかの制限があります。

  1. .

  2. it cannot be prettified.

26
gcb

永続的に保存するためにこれが必要かどうかはわかりませんが、jsを一時的に変更する必要がある場合：

変更したいjavascriptをテキストエディターにコピーして編集し、コンソールに貼り付けると、関数や再定義が必要なものが再定義されます。

たとえば、ページに次のものがある場合：

<script>
var foo = function() { console.log("Hi"); }
</script>

スクリプト間でコンテンツを取得して編集し、次のようにデバッガーに入力できます。

foo = function() { console.log("DO SOMETHING DIFFERENT"); }

そしてそれは私のために働くでしょう。

またはあなたが好きなら

function foo() {
    doAThing();
}

ただ入ることができます

function foo() {
    doSomethingElse();
}

そしてfooは再定義されます。

おそらく最善の回避策ではありませんが、動作します。ページをリロードするまで続きます。

11
byronaltice

「chrome dev tool edit javascript」で検索しました。このページは最初の検索結果です。しかし、それはあまりにも時代遅れです、それは私を助けません。

Chrome 73を使用していますが、このバージョンのChromeには[ローカルオーバーライドを有効にする]オプションがあります。関数を使用して、javascriptを編集し、実行およびデバッグできました。

enter image description here

1
wafe