开发学院网页设计 JavaScript 完全基于 JavaScript 实现的分栏搜索百度和 Googl... 阅读

完全基于 JavaScript 实现的分栏搜索百度和 Google 的页面

　2010-09-14 13:38:07　来源：WEB开发网　闂傚倸鍊搁崐椋庢濮橆兗缂氱憸宥堢亱闂佸湱铏庨崰鏍不椤栫偞鐓ラ柣鏇炲€圭€氾拷

闂傚倸鍊搁崐椋庣矆娓氣偓楠炲鏁撻悩鎻掔€梺姹囧灩閻忔艾鐣烽弻銉︾厵闁规鍠栭。濂告煕鎼达紕校闁靛洤瀚伴獮鎺楀箣濠靛啫浜鹃柣銏⑶圭壕濠氭煙閻愵剚鐏辨俊鎻掔墛缁绘盯宕卞Δ鍐冣剝绻涘畝濠佺敖缂佽鲸鎹囧畷鎺戭潩閹典焦鐎搁梻浣烘嚀閸ゆ牠骞忛敓锟�

婵犵數濮烽弫鍛婃叏椤撱垹绠柛鎰靛枛瀹告繃銇勯幘瀵哥畼闁硅娲熷缁樼瑹閳ь剙岣胯鐓ら柕鍫濇偪濞差亜惟闁宠桨鑳堕崝锕€顪冮妶鍡楃瑐闁煎啿鐖奸崺濠囧即閵忥紕鍘梺鎼炲劗閺呮稒绂掕缁辨帗娼忛埡浣锋闂佽桨鐒﹂幑鍥极閹剧粯鏅搁柨鐕傛嫹闂傚倸鍊搁崐椋庢濮橆兗缂氱憸宥堢亱闂佸湱铏庨崰鏍不椤栫偞鐓ラ柣鏇炲€圭€氾拷　　闂傚倸鍊搁崐鐑芥嚄閼哥數浠氱紓鍌欒兌缁垶銆冮崨鏉戠厺鐎广儱顦崡鎶芥煏韫囨洖校闁诲寒鍓熷铏圭磼濡搫顫岄梺璇茬箲濮樸劑鍩€椤掍礁鍤柛鎾跺枎椤繐煤椤忓嫬鐎銈嗘礀閹冲酣宕滄导瀛樷拺闂侇偆鍋涢懟顖涙櫠椤斿墽纾煎璺猴功缁夎櫣鈧鍠栭…閿嬩繆濮濆矈妲烽梺绋款儐閹瑰洤螞閸愩劉妲堟繛鍡楃箲濞堟﹢姊绘担椋庝覆缂傚秮鍋撴繛瀛樼矤閸撶喖宕洪埀顒併亜閹烘垵鈧綊寮抽鍕厱閻庯綆浜烽煬顒傗偓瑙勬磻閸楀啿顕ｉ崐鐕佹Ь闂佸搫妫寸粻鎾诲蓟閵娾晜鍋嗛柛灞剧☉椤忥拷

核心提示： 看似没啥问题了，先不管头页面，完全基于 JavaScript 实现的分栏搜索百度和 Google 的页面(2)，试试再说，咦，不过遇到了更加棘手的问题，由于篇幅问题，页面一闪就跳到百度搜索了，突然想到以前看过防止被放入框架的方法

看似没啥问题了，先不管头页面，试试再说。咦，页面一闪就跳到百度搜索了，突然想到以前看过防止被放入框架的方法，莫不是百度这个昔日的“流氓”现在依然“流氓”？查看百度搜索的源代码，果然有这样一条：if (top.location != self.location) {top.location=self.location;} ，这下可得好好琢磨一下了，top 代表我的这个框架页，我在框架页上声明一个全局变量也叫 location，是不是就会绕过去呢？于是加了一条 var location = ''; 在 window.onload = function() 的外面，刷新，这下好了，两个搜索框架空空如也，原来是我在获取 url 的时候使用了 location 属性，结果变成了使用我声明的 location 变量，值为 ''，于是改成 document.location ，搞定！于是整段代码就是这个样子了：

varlocation=''; window.onload=function(){ 　　varurl=document.location.toString().split('?'); 　　varw='',p=1; 　　if(url.length==2){ 　　　　url=url[1].split('&'); 　　　　w=url[0].substring(2); 　　　　if(url.length==2) 　　　　　　p=parseInt(url[1].substring(2)); 　　} 　　if(w=='') 　　　　document.location='baigoogledu.htm'; 　　varhead=document.getElementById('head'); 　　varbaidu=document.getElementById('baidu'); 　　vargoogle=document.getElementById('google'); 　　head.src='baigoogledu_head.htm?w='+w+'&p='+p.toString(); 　　p=(p-1)*10; 　　google.src='http://www.google.cn/search?q='+w+'&start='+p.toString(); 　　baidu.src='http://www.baidu.com/s?ie=utf-8&wd='+w+'&pn='+p.toString(); }