在HTML网页中巧用URL
http://www.cnbruce.com/blog/showlog.asp?cat_id=5&log_id=657
首先，先放出一個(gè)地址給大家測(cè)試
http://cnbruce.com/test/htmlpro/?name=cnbruce&email=cnbruce@126.com
1，時(shí)下流行的（可能是吧，因?yàn)樽罱鼏柕娜吮容^多）就是沒有任何文件名的URL地址。比如htmlpro/?其實(shí)這和服務(wù)器設(shè)置的默認(rèn)文件名有關(guān)，比如index.htm，index.html，index.asp等等，不信你試試我朋友的一個(gè)（asp的）。
http://www.windsn.com/blog/?viewType=byCate&cateID=3
2，本處的文件為index.html，同時(shí)后面帶有參數(shù)，頁面效果如同ASP一般提取信息內(nèi)容。
如下是轉(zhuǎn)載的文章（作者劉筱）可以說明些東西
經(jīng)常上網(wǎng)的朋友肯定對(duì)“?http://host/***.asp?arg1=*&arg2=* ?”之類的URL(即網(wǎng)址)不會(huì)陌生。這類網(wǎng)址的作用就是通過在URL后面附加信息內(nèi)容來傳遞相關(guān)信息給遠(yuǎn)程Web服務(wù)器，并在Web服務(wù)器進(jìn)行適當(dāng)處理后將結(jié)果返回給客戶端，從而達(dá)到網(wǎng)頁交互的目的，并實(shí)現(xiàn)網(wǎng)頁內(nèi)容動(dòng)態(tài)化。(注意:?URL與信息內(nèi)容之間通過“?”連接，各內(nèi)容字段之間則通過字符“&”來分隔，每個(gè)字段的名稱/取值表示為“名稱=取值”形式。)但通過這種方式實(shí)現(xiàn)的動(dòng)態(tài)網(wǎng)頁均需要服務(wù)器端編程技術(shù)的支持，最近筆者在制作個(gè)人網(wǎng)站時(shí)利用瀏覽器支持的DHTML和XML技術(shù)，經(jīng)過不斷嘗試，在免費(fèi)主頁空間通過這種方式實(shí)現(xiàn)動(dòng)態(tài)網(wǎng)頁。
一、原理分析
當(dāng)瀏覽器通過http://remotehost/program?querystring ?這種方式請(qǐng)求Web服務(wù)器時(shí)，Web服務(wù)器將對(duì)請(qǐng)求地址的URL進(jìn)行解析，把“?”后面的querystring字符串存入服務(wù)器特定環(huán)境變量，然后調(diào)用服務(wù)器端編程執(zhí)行環(huán)境，如ASP(Activex?Server?Page)等對(duì)請(qǐng)求program文件進(jìn)行處理。
具體調(diào)用何種編程執(zhí)行環(huán)境依據(jù)服務(wù)器的設(shè)置而定，如果請(qǐng)求的文檔是asp類型的文件，則調(diào)用ASP，如是aspx類型文件，則調(diào)用ASP.NET。在program文件中則可以通過一定方法來讀取環(huán)境變量，如asp文件就可以通過Reques.Querystring數(shù)據(jù)集合來讀取環(huán)境變量。編程執(zhí)行環(huán)境處理完畢后將結(jié)果返回給Web服務(wù)器，Web服務(wù)器再將結(jié)果返回給瀏覽器，從而達(dá)到網(wǎng)頁內(nèi)容動(dòng)態(tài)化的目的。
通過上述分析我們可以知道，如果使用http://remotehost/*.htm?querystring ?方式向Web服務(wù)器發(fā)送請(qǐng)求時(shí)，Web服務(wù)器將向?yàn)g覽器直接返回請(qǐng)求的HTML網(wǎng)頁。這時(shí)我們就可以在網(wǎng)頁中利用Location.href屬性獲得附加了信息內(nèi)容的URL串，經(jīng)過適當(dāng)處理后就可以得到所附加的信息內(nèi)容字段名稱及其取值，再通過瀏覽器支持的DHTML特性進(jìn)行處理，就可以實(shí)現(xiàn)網(wǎng)頁內(nèi)容動(dòng)態(tài)化，從而在不支持服務(wù)器端編程技術(shù)的免費(fèi)主頁空間上達(dá)到網(wǎng)頁交互的目的。
我們也可以看出，通過這種方式達(dá)到網(wǎng)頁動(dòng)態(tài)交互的目的即使是在瀏覽器中實(shí)現(xiàn)也仍然擺脫不了Web服務(wù)器的支持，否則瀏覽器將把“?querystring”作為請(qǐng)求的URL的一部分，從而出現(xiàn)網(wǎng)頁不能查看的錯(cuò)誤提示。
二、應(yīng)用示例
---下面給出了一個(gè)帶有詳細(xì)注釋的具體示例源代碼。注意:?querystring.js是一個(gè)實(shí)用程序，它可以在網(wǎng)頁中直接引用，然后在網(wǎng)頁中使用Request[“名稱”]即可獲取用戶輸入的有關(guān)信息內(nèi)容。
1.querystring.js源代碼
function?QueryString() {//構(gòu)造參數(shù)對(duì)象并初始化 var?name,value,i; var?str=location.href;//獲得瀏覽器地址欄URL串 var?num=str.indexOf("?") str=str.substr(num+1);//截取“?”后面的參數(shù)串 var?arrtmp=str.split("&");//將各參數(shù)分離形成參數(shù)數(shù)組 for(i=0;i?<?arrtmp.length;i++){ num=arrtmp[i].indexOf("="); if(num>0){ name=arrtmp[i].substring(0,num);//取得參數(shù)名稱 value=arrtmp[i].substr(num+1);//取得參數(shù)值 this[name]=value;//定義對(duì)象屬性并初始化 } } } var?Request=new?QueryString();//使用new運(yùn)算符創(chuàng)建參數(shù)對(duì)象實(shí)例 |
2.Sample.htm源代碼
<Html> <Head> <Meta?http-equiv="Content-Type"content="text/html;?charset=gb2312"?> <Title>示例</Title> <script?src="Querystring.js"></script> </Head?> <Body> <script> var?newElement=document.createElement("div");//創(chuàng)建div對(duì)象 var?str="<u>"+Request["name"]+"</u>,歡迎光臨!<br>您的E-mail是:<u>"+Request["email"]+"</u>";//利用實(shí)例["字段名稱"]獲取參數(shù)內(nèi)容 newElement.innerHTML=str; document.body.appendChild(newElement);//向文檔添加div對(duì)象 </script> </Body> </Html> |
如果對(duì)該示例應(yīng)用DHTML與XML技術(shù)進(jìn)行擴(kuò)充，將會(huì)取得不可思議的效果。該作者就是通過這種途徑在只支持純HTML的主頁空間建立了一個(gè)相當(dāng)不錯(cuò)的動(dòng)態(tài)圖片查看器
所以，各位，實(shí)踐下咯。
總結(jié)
以上是生活随笔為你收集整理的在HTML网页中巧用URL的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： php几个预定义变量$_SERVER['
- 下一篇： 用Visual C#创建Windows服