首先說一下所謂靜态頁面參數傳遞的意思。
有a.html和b.html兩個頁面,不通過伺服器,隻用JS實作,把a頁面裡面參數傳到b頁面中去。
正常情況下,隻有通過後端伺服器才能動态控制模闆頁面的參數,但是有時候我們需要類似于後端一樣的動态操作,又隻能前端操作的時候,就需要到了這種傳遞簡單參數的方法。
1.傳遞參數的頁面:send.html
<button type="button" onclick="sendurls(urls,titles,imgurls)"></button>
<script>
function sendurls(urls,titles,imgurls){
window.open(encodeURI(urls+ "?imgurls="+imgurls +"?artileTitle="+titles),"_self");
</script>
說明:在 a頁面建立一個發送參數的函數sendurls(),urls參數是一個位址(這個位址參數在b頁面接收後,可作為想連結到的頁 面的href連結位址);imgurls參數是一個圖檔位址參數,artileTitle參數為一段文本(在這裡我用為b頁面的标題);_self為 在目前頁面打開(window.open()預設問為在新視窗打開)。
2.接收參數的頁面:gets.html
- <div class="content">
- <h3 id="lcTitle"><!-- 标題 --></h3>
- <img src="" class="pageImg" id="pageImg" alt="">
- </div>
- <script>
function geturls(){ //擷取目前的位址(位址裡含有從a頁面傳遞過來的三個參數) var urlsinfo = window .location.href; //正則比對擷取的位址,擷取圖檔位址參數。 var imgurls = urlsinfo .split("?")[1].split("=")[1]; //正則比對擷取的位址,擷取文本參數。 var articletitle = urlsinfo .split(" artileTitle =")[1]; //将接受頁面的标題修改為接收到的文本标題參數 decodeURI </ span > 為位址解碼 document.title = decodeURI (articletitle); /同上-》将文章标題修改為擷取的标題文本 document.getElementById('lcTitle') .innerHTML = decodeURI (articletitle); //将圖檔位址改為擷取的圖檔位址參數 document.getElementById('pageImg').setAttribute("src",imgurls); </ script > **在b頁面的body内添加onload事件,加載這個函數就完成了在a頁面點選不同的按鈕,動态修改b頁面的網頁标題,文章标題和圖檔的功能。
如:<body onload="geturls()">
轉載請附加文本位址說明:http://blog.csdn.net/wdzmds