iPhoneのSafariで HTMLソース の表示する方法

電車で移動中にいろんなサイトを閲覧してて、ちょっと HTMLソース を見てみたいと思ったことありませんか?PCだと簡単に見れるのですが、Safariで表示する方法が無いか調べました。

基本的な方法は「ブックマークレット」を利用する方法のようです。(「ブックマークレット」とはブックマーク(お気に入り)に置いて、そこから呼び出すプログラムのことです。)

ブックマークを追加

何でもいいのでまずはブックマークを追加します。




ブックマークを編集




ブックマークを編集します。とりあえず名前は何でもいいのですが分かりやすく「ソース表示」にしました。


アドレスに「JavaScript」を入力する

アドレスに「JavaScript」を入力します。
アドレスバーでは自動的にエンコードされますが、お気に入りに入力の際は自動的にエンコードされないので、URLエンコードする必要があります。

javascript:d=document;c=d.charset||0;i=0;o=d.documentElement;d.write%28%22%3Cpre%3E%22+%28o.outerHTML||o.innerHTML%29.replace%28/&/g,%22&%22%29.replace%28/%3C/g,%22<%22%29.replace%28/%3E/g,%22>%22%29+%22%3C/pre%3E%22%29;c?d.charset=c:0;void%28document.close%28%29%29;


登録したら、ソースを見たい画面でお気に入りの「ソース表示」をタップします。



ただ、これだとイマイチ分かりにくいので、こちらはSnoopyを採用したバージョン。

javascript:(function()%7Bvar%20d%3Ddocument%2Cs%2Ce%3Bvar%20el%3Dd.getElementById('snpy')%3Bif(typeof%20Snoopy!%3D'undefined')%7BSnoopy.toggle()%3Breturn%7Delse%20if(el)%7Bel.className%3D%2Fclosed%2F.test(el.className)%3Fel.className.replace('closed'%2C'')%3Ael.className%2B'%20closed'%3Breturn%7Ds%3Dd.createElement('link')%3Bs.setAttribute('href'%2C'http%3A%2F%2Fsnoopy-assets.allmarkedup.com%2Fsnoopy-min.css')%3Bs.setAttribute('rel'%2C'stylesheet')%3Bs.setAttribute('type'%2C'text%2Fcss')%3Bd.getElementsByTagName('head')%5B0%5D.appendChild(s)%3Be%3Dd.createElement('script')%3Be.setAttribute('src'%2C'http%3A%2F%2Fsnoopy-assets.allmarkedup.com%2Fsnoopy-min.js')%3Bd.getElementsByTagName('body')%5B0%5D.appendChild(e)%7D)()%3B



外出先とかでソースを確認したい時は使ってみてください。

応援よろしくお願いします。
いいね ! してもらえると嬉しいです。

Twitter で

自己紹介

松田 大 と申しますm(_ _)m
インディーズでミュージシャンをやっていたのですがいつのまにか...

とある企業でショップのアルバイトスタッフから正社員、支店長を経てシステム部門に異動するという、開発担当としては変わった経緯を持っている方だと思います。

一昨年の3月に結婚し、尻敷かれ男子の仲間入りを果たしました(笑)

現在勤めているJTクラウドシステムでは、「 WordPress 」を活用したWEBサイト、業務用WEBアプリケーション開発「 Excel VBA 」を活用した効率化ツールの開発を中心に「 ネットワーク・サーバー構築 」や「 Office365製品の導入支援 」、最近は、ホームページ制作に加え、記事の執筆代行や掲載に必要な情報のリサーチ、映像のテロップ入れや切りはりなどの簡単な動画編集なども、まとめて行なっています。

お問い合わせはJTクラウドシステムホームページからお願いします。
スポンサーリンク