WEB業界で働く人や興味がある人に役立つ情報サイト“qam（カム）”

投稿者： くりりん
カテゴリー： マークアップ >サービス

最近、職場でWebサイトを見る際にパソコンで見ることはありますが、家で見るときはスマートフォンを使う事が多いのではないでしょうか。
その時にどうやってコードを書いているんだろう？と気になることがあります。
そんな時は…
気になるページのソースコードをスマホで見てみよう

Androidでみる

使用するブラウザにも寄りますが、PCと同様に【view-source:】とURLの最初に書くだけで表示されます。

chromeが一番おすすめです。
Androidではこんなに簡単に見ることができるのですが、iPhoneで確認するには少しややこしいかもしれません…

iPhoneでみる

ブックマークに登録

まずはじめに、ソースコードを確認したいサイトにアクセスしブックマークに登録します。

この画面が出たら、完了をタップします。

ブックマーク一覧で編集

次にブックマークの一覧に行きます。
しっかり登録されているのを確認したら

右下の編集をタップします。
登録されたものを選択しURL部分を完全に削除します。

挿入

削除したところに下記のコードを入れます。コピー&ペーストで貼っていきましょう。

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

確認

最後にURL部分を書き換えたサイトに行きます。
すると上部分にソースコードが見られるようになっています。

まとめ

しっかりとソースコードを見たいときにはやはりパソコンが一番良いと思いますがちょっとした時間に確認してみたいコードがある時に、便利になる機能だと思います。皆さんも是非お試しみてはいかがでしょうか？