對于網頁制作者來說,看到一些設計得較有特色的網頁,通過查看源代碼能幫助用戶更好地制作網頁。但是IE提供的查看源文件功能很有限,許多功能都不能實現,如想查看網頁的外部樣式表及Java腳本代碼、保存各類網頁文件等,都無法實現。
其實可以使用“Instant Source'’這個工具來輕松查看和保存網頁的源代碼及網頁文件,它是一個非常實用的IE插件?!癐nstant Source”安裝后自動整合到IE瀏覽器中,需要使用時,只要點擊IE工具欄上的“InstantSource”圖標,在瀏覽器下方便出現一個代碼顯示窗口及它的功能按鈕了。
輕輕一點網頁源代碼全顯
打開需要查看源代碼的網頁,在“Instant Source”的功能按鈕區單擊“顯示”圖標,這時會出現一個下拉菜單,其中有“鼠標所指元素”、“選定文本”、“整個網頁”、“鼠標所指的顏色”等菜單項,如從中選擇“鼠標所指元素”這種顯示模式,之后只要用鼠標指向網頁上的某一元素,它的網頁代碼便會即時顯示在下面的代碼區域(如圖1)。對于加入網頁中的樣式表CSS、Java腳本等外部對象的代碼,也可以點擊代碼窗口下方相應按鈕來查看。若要查看網頁中某處的顏色,就選擇“鼠標所指的顏色”菜單項,這時鼠標在網頁中移動就能直接獲取網頁上各種顏色的R、G、B值及HEX代碼。

另外,在查看代碼時可使用“復制”、“查找”等按鈕,方便實現選定代碼的提取,還能從眾多代碼中快速定位到自己需要的代碼位置。
巧妙設置查看更快捷
工具的許多強大的功能通過設置才能發揮出來。單擊功能按鈕區中的“選項”,就會彈出一個“In st antsource選項”對話框(如圖2),在‘常規設置“標簽下,可以設置更為詳細的顯示模式。在這兒選擇“鼠標所指的HTML元素”這個單選項后,再選擇“自由模式”或“僅在按壓Ctrl鍵時顯示源代碼”等選項,就可以配合Shift、Ctrl鍵的操作來顯示更多有價值的內容,還可以鎖定顯示的源代碼和顯示HTML代碼的上級元素。
如果“Instant Source'’默認的代碼顯示字體和顏色不符合自己的習慣,就可切換到“字體和顏色”標簽中進行設置,在這兒可以設置字體大小、顯示代碼的背景色和代碼文本顏色等,以符合自己的閱讀習慣。代碼顯示默認是來顯示行號的,這在閱讀眾多代碼時很不方便,切換到“頁邊空白”標簽中,在其中勾選“顯示行號”項,顯示代碼時就會顯示代碼的行號,方便閱讀。
現在的網頁都會與其它網頁鏈接,也會引入外部對象,如樣式表c ss、J av a腳本、圖片、Flash動畫等,要保存這些引入網頁的外部對象,只需單擊“對象”圖標,打開一個“頁面對象”窗口(如圖3),在這里選擇需要的東西,再單擊“保存”按鈕就可以了,更好的是在這兒可以選擇“鏈接”下的網頁地址來保存各類網頁文件,如asp、aspx、php等網頁文件。還可以單擊“全部保存”選項,全部保存到自己的硬盤中。
利用IE編輯修改網頁真直觀
對于保存在本地硬盤中的網頁文件,通常是使用網頁編輯軟件編輯后,再調用瀏覽器查看效果,其實安裝了“Instant Source”這個工具后,就可以在IE中瀏覽的同時直接對網頁進行編輯修改了,只需選擇“顯示”按鈕下的“整個頁面(原始)”模式,就可以直接對源代碼進行編輯,然后單擊“應用”按鈕,就能馬上在瀏覽器窗口中看到編輯后的效果,并保存該網頁。
通過這個功能強大的網頁源代碼查看工具,就能讓制作網頁工作事半功倍,提高效率,能吸取優秀網頁的長處,方便地使用到我們的網頁當中來。