101

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

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

4

6 に答える 6

115

私はこの質問が古くなっていることを知っていますが、私はちょうど同様の問題を抱えていて、解決策を見つけました。

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

于 2013-04-03T13:53:14.057 に答える
56

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

于 2012-12-07T20:32:32.333 に答える
32

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

  1. JSファイルである必要があります。HTMLページにタグを埋め込むことはできません。

  2. かわいらしくすることはできません。

于 2014-05-22T21:03:47.050 に答える
14

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

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

たとえば、ページに次のようなものがある場合:

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

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

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

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

またはあなたが好きなら、

function foo() {
    doAThing();
}

あなたはただ入ることができます

function foo() {
    doSomethingElse();
}

fooが再定義されます。

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

于 2015-03-26T19:38:41.910 に答える
6

「chromedevtooleditjavascript」を検索しました。このページは最初の検索結果です。しかし、それは古すぎます、それは私を助けません。

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

ここに画像の説明を入力してください

于 2019-04-24T03:21:58.660 に答える
0

私の解決策:

  1. devtools設定で、[ローカルオーバーライドを有効にする]をオンにします。
  2. [ネットワーク]タブに移動し、編集するファイルを見つけて右クリックし、[オーバーライド用に保存]を選択します([ソース/オーバーライド]タブで、ローカルフォルダーを追加する必要があります)
  3. ファイルは[ソース]タブの新しいタブにローカルコピーとして表示されるため、このファイルを編集できます。サイトをリロードすると、新しい(および編集された)オーバーライドファイルがサイトにロードされます。
于 2022-01-30T21:20:12.673 に答える