jQuery透過控制節點實作僅在前台透過get方法完成參數傳遞_jquery

本文實例講述了jQuery透過控制節點實現僅在前台透過get方法完成參數傳遞。分享給大家供大家參考。具體分析如下：

這樣也是HTML DOM那部分的內容，javascript與jquery等前端腳本語言的核心就是要控制每一個節點，對每一個節點進行增刪改查，這樣才能夠真正地活用javascript與jquery等前端腳本寫出一個又一個華麗的東西。

javascript控制節點，筆者已經在之前的【JavaScript針對網頁節點的增刪改查用法實例】有過相關介紹，現在是透過jquery這一javascript進階的腳本語言，來控制節點，並且在此基礎上，使用jquery來在不同網頁間傳遞參數，僅在前台透過get方法完成參數傳遞，掛到伺服器，不需要jsp與asp，寫一些request等伺服器語言來取得參數。

一、基本目標

在網頁中有存在於黑色div-紅色div-藍色p之下的span節點，一旦點擊，則分別獲取其上面節點的id

點擊增加按鈕可以增加超級連結節點，其中每一個超級連結都帶有中文參數你好1，你好2，你好3…，而且滾動條自動隨節點的增加而滾動，向jqrec. html傳遞，這個你好x參數，jqrec.html頁面能夠取得這個中文參數

點選清空鈕可以清空ul下方的所有節點

二、製作過程

jqrec.html全程式碼如下，所使用的函數，涉及到分析url位址的正規表示式，不用細究。真正作用的程式碼則只有，$("#rec").text(unescape(getUrlParam("text")));

複製代碼 代碼如下:

 
 
 
 
 
 
 
 

 
你點擊的連結是：，這與瀏覽器上的get方法傳過來的text參數完全相同~ 

 

 
text上傳遞的參數是中文來的哦，需要結果譯碼解碼~ 

 

 
回jqsend.html再試一次~ 

 
 
 
<script>  <br /> /*此函數配合unescape函數能夠對url上get方法傳遞過來的utf-8元素進行解碼*/  <br /> function getUrlParam(name)  <br /> {  <br /> var reg = new RegExp("(^|&)" name "=([^&]*)(&|$)");   <br /> var r = window.location.search.substr(1).match(reg);    <br /> if (r!=null) return unescape(r[2]); return null;   <br /> }   <br /> $(function() {  <br />     $("#rec").text(unescape(getUrlParam("text")));  <br />     });  <br /> </script>

jqsend.html全程式碼如下，具體程式碼請看註解：

複製程式碼 程式碼如下:

 
 
 
 
 
 
 
 
 
 
 

 

 

 
 
我的父节点 
 

 

 

 

 
 
 
增加 
清空