80

Android ブラウザーで Web サイトの CSS/HTML 要素を検査したいと考えています。

ただし、スマートフォンまたは Android SDK 以上になります。

それを行う最良の方法は何ですか？

4

5 に答える 5

60

Android 上の Chrome を使用すると、デスクトップ上の Chrome 開発者ツールを使用して、Android デバイス上の Chrome アプリケーションから読み込まれた HTML を検査できます。

参照: https://developers.google.com/chrome-developer-tools/docs/remote-debugging

于 2012-11-11T10:16:56.913 に答える
43

ネイティブ Android ブラウザーのサイトをデバッグする必要があり、ここに来ました。そこで、Firefox 30.0 (weinre クライアント) と Android 4.1.2 (ターゲット) を使用して、OS X 10.9 (weinre サーバーとして) で weinreを試しました。この結果には本当に、本当に驚いています。

  1. ノード ランタイムをhttp://nodejs.org/download/からダウンロードしてインストールします。
  2. ワインをインストールします。sudo npm -g install weinre
  3. [設定] > [ネットワーク] で現在の IP アドレスを確認します
  4. マシンに weinre サーバーをセットアップします。weinre --boundHost YOUR.IP.ADDRESS.HERE
  5. ブラウザ呼び出しで:http://YOUR.IP.ADRESS.HERE:8080
  6. スクリプト スニペットが表示されるので、サイトに配置します。<script src="http://YOUR.IP.ADDRESS.HERE:8080/target/target-script-min.js"></script>
  7. ローカル ブラウザでデバッグ クライアントを開きます: http://YOUR.IP.ADDRESS.HERE:8080/client
  8. 最後に Android で: 検査するサイト (スクリプトが含まれているサイト) を呼び出し、ローカル ブラウザーで "Target" としてどのように表示されるかを確認します。これで、「要素」または必要なものを開くことができます。

おそらく、8080 はデフォルトのポートではありません。次に、ステップ 4 で に電話する必要がありますweinre --httpPort YOURPORT --boundHost YOUR.IP.ADRESS.HERE。

そして、それがいつだったのか正確には覚えていません。おそらく、ステップ 5 の後のどこかで、もちろん、着信接続プロンプトを受け入れなければなりませんでした。

楽しいデバッグ

PS私はまだそれがどれほどうまくいくかに圧倒されています。要素を強調する作業でも

于 2014-07-23T20:41:47.687 に答える
0

このコードをリンクとしてブックマークするだけです:

javascript:(function () { var script = document.createElement('script'); script.src="//cdn.jsdelivr.net/npm/eruda"; document.body.appendChild(script); script.onload = function () { eruda.init() } })();

サイトを開いた後、ブックマークを開きます（検索バーで保存された名前を検索して）。ブックマークが検索バーに表示されて開くと、Android で要素を検査します。

于 2021-03-11T14:45:33.940 に答える