【Mac不要】iPhoneだけでWebインスペクターを使う方法

WebサイトやWebアプリ開発していると、iPhoneでの動作確認が必要なことがあると思います。

表示や動作に問題がある場合はインスペクターを使って調査していくかと思いますが、iPhoneとMacを接続する必要があります。

しかし、iPhone Safariの拡張機能である「Web Inspector」を使うと、MacなしでWebページを調査することができます。

この記事では、iPhoneから「Web Inspector」を使う方法を紹介します。

アプリのダウンロード方法

iPhoneの App Storeから「Web Inspector」と検索してアプリのインストール画面を表示します。

または以下のURLにアクセスします。

https://apps.apple.com/jp/app/web-inspector/id1584825745

このアプリをインストールします。

拡張機能の有効化

アプリを開くと、設定画面から拡張機能を有効にするように促されます。

拡張機能を有効にする方法を説明します。

まず設定アプリを開き、「safari」をタップします。

「拡張機能」をタップします。

「Web Inspector」をタップします。

有効にします。

safariを開いて、拡張機能から「Web Inspector」が表示されていれば設定は完了です。

DOM

DOMタブでは、画面項目と、それに対応するHTMLソースを確認できます。

マウスポインタのマークをクリックします。

画面が変わりますので、調べたい画面項目をクリックします。

クリックすると、対応するHTMLが表示されます。

Element

Elementタブは、選択した画面項目のHTMLコードや属性、CSSなどが表示されます。

Console

Consoleタブは、JavaScriptコンソールです。

JavaScriptの実行もできます。

Consoleタブの1番下にある「> 」の部分にJavaScriptを入力します。

今回はalert文を入力してみました。

画面をズームアウト（ピンチアウト）して「Execute」をタップします。

以下の画像のとおり、実行することができました

Network

Networkタブでは、各リクエストのHTTPステータス、メソッド、ファイル種別、ファイルサイズ、通信時間を確認できます。

Resource

Resourceタブでは、Local Storage, Session Storage, Cookieなどのデータを確認できます。

いらなくなった iPhoneやiPad、MacBookを売ってみませんか？

iPhone Plaza は、横浜と新大久保に店舗をもつ、Apple製品全般の買取専門店です。

iPhoneやiPad、MacbookなどのApple製品の買取を行なっています。

新品未開封品から中古、ガラス割れ等のジャンク品まで買取していて、残債が残っているものや、アクティベーションロックが解除できないものも買い取ってもらえるようです。

宅配買取は、送料無料、振込手数料無料で、宅配キットも無料で送付してもらえます。

原則として商品到着の翌日（土日祝祭日は除く）には、買取代金の振込が完了するようです。

いらないApple製品をお持ちの方は、検討してみてはいかがでしょうか。