圖2 javascript程式碼的結果 這說明返回的javascript，就是用document.write向頁面寫入了圖片和一些文字連結。檢視網頁原始碼，果然不出我所料。程式碼如下： document.write("<div style='margin:0;padding:0;width:378px;overflow:hidden;position:relative;font-size:12px;'><div style='margin:0;padding:0;height:220px;border:solid Black 1px;'><em style='display:block;position:absolute;width:376px;text-align:center;line-height:24px;color:White;opacity:0.8;filter:alpha(opacity=80);background:#6b8baa;font-style:normal;'>我的足跡</em><div style='margin:0;padding:0;'><img src='/ctripmember/travelmapimage/default.aspx?screenname=11D4CC7F0E0444CA91B85E65045F4C72' alt='' /></div></div><ul style='margin:0;padding:10px 0 0 15px;line-height:22px;'><li style='margin:0;padding:0;list-style:disc outside;'>訪問我的<a href='http://members.ctrip.com/11D4CC7F0E0444CA91B85E65045F4C72' style='color:#07328e;text-decoration:underline;'>攜程個人主頁</a></li><li style='margin:0;padding:0;list-style:disc outside;'>建立你自己的<a href='http://members.ctrip.com/' style='color:#07328e;text-decoration:underline;'>足跡秀</a></li></ul></div>"); 那麼，只要把document.write函式中的HTML部分仔細分析，並提取出圖片的部分即可。去掉文字、連結，保留最外層div後，程式碼如下： <div style='margin:0;padding:0;width:378px;overflow:hidden;position:relative;font-size:12px;'><img src='/ctripmember/travelmapimage/default.aspx?screenname=11D4CC7F0E0444CA91B85E65045F4C72' alt='' /></div> 這實際上就是兩個巢狀的div中包含一個img了。不過還沒完，這裡還需要繼續改進。 第二，div的尺寸太大，會超出新浪部落格元件的寬度，從而“浮”在頁面的表面。將div中的各種大小、邊界、空白屬性一律去掉，將其overflow:hidden屬性改為overflow:auto，就會自動出現滾動條，從而不會讓整個圖片超出範圍了。 第三，上面的程式碼只是顯示一個圖片，然而參考之前的“四海賓客之地圖”、“四海賓客之數字”兩個元件，應該為圖片加上超連結，連結到相應網站，從而為感興趣的使用者提供方便的訪問，所以為img加上了超連結。一開始忘了給超連結設定target="_blank"屬性，導致一點選就在當前頁面跳轉了。 至此，大功告成~ 最終程式碼：