九色国产,午夜在线视频,新黄色网址,九九色综合,天天做夜夜做久久做狠狠,天天躁夜夜躁狠狠躁2021a,久久不卡一区二区三区

大家在實際編寫網(wǎng)頁時可能會遇到網(wǎng)頁中需要嵌套網(wǎng)頁的情況，這時候通常想法就是通過iframe標簽。

但實際用過的人都知道其有種種的不方便，比較直觀的問題就是iframe的自適應高度，這也是處理起來比較麻煩的問題，隨便百度下都是一大串的代碼。

iframe貌似還有個重大的缺點，那就是搜索引擎的“爬蟲”程序無法解讀這種頁面，當“爬蟲”遇到多個頁面嵌套的網(wǎng)頁時只看到框架卻找不到鏈接，然后認定此網(wǎng)站是死站點并離開。

學過SEO（搜索引擎優(yōu)化）的朋友都知道，這對網(wǎng)頁無疑是毀滅性的打擊。

但是我們確實需要嵌套網(wǎng)頁怎么辦？比如：

這里拿個微信舉例，用戶都知道當切換下面的功能時頂部的頁頭及詢問的工具欄樣式是不變的。所以我們只需要在用戶點擊下面不同的功能按鈕時改變中間的內(nèi)容即可。

那即使不考慮SEO，至少布局上有沒有比iframe更方便的東西呢?jquery ajax就能做到，它不僅能發(fā)起請求還能裝載頁面。

稍微介紹下jquery ajax，首先我們來比較下傳統(tǒng)和jquery的ajax的不同

傳統(tǒng)javascript ajax封裝函數(shù)：

function ajax(method,url,param,flag,returnFun){  var httpRequest="";  if(window.XMLHttpRequest){    httpRequest=new XMLHttpRequest();  }else if(window.ActiveXObject){    httpRequest=new ActiveXObject("Microsoft.XMLHTTP");  }  httpRequest.onreadystatechange=function(){    if(httpRequest.readyState==4 && httpRequest.status==200){      returnFun(httpRequest.responseText);    }  };  if(method=="get"){    var queryString="";    if(param !="" || param !=null){      queryString="?"+param;    }    httpRequest.open("get",url+queryString,flag);    httpRequest.send(null);  }else if(method=="post"){    httpRequest.open("post",url,flag);    httpRequest.setRequestHeader("content-type","application/x-www-form-urlencoded");    httpRequest.send(param);  }}

封裝后的寫法：

ajax("post","../login.do","username="+username+"&pwd="+pwd,true,function(text){}

參數(shù)：1.請求方式 2.請求路徑 3.參數(shù)傳遞 4.是否異步刷新 5.回調(diào)函數(shù)

jquery ajax：

$.ajax({ 選項 })

jquery ajax的選項有很多，簡單例幾個常用的比如：

data：數(shù)據(jù)

cache：是否緩存

success/error：成功/失敗時的回調(diào)函數(shù)

type：請求類型

url：請求路徑

要想更深入的了解可以下個jquery API看看。

比較實用的兩種用法

第一種用法，對服務器的數(shù)據(jù)進行操作：

var username="jack";  var password=123;  $.ajax({    type:"post",    url:"../insert.do",    data:"username="+username+"&password="+password,    success:function(msg){      if(msg=="ok"){        alert("complete");      }	    }  })

這就是個最簡單的通過 node.js 添加數(shù)據(jù)的 jquery ajax 請求。

type設置類型為post；url設置請求路徑；data設置要傳遞的參數(shù)，注意寫法；如果要查詢數(shù)據(jù)，回調(diào)函數(shù)中的回調(diào)值msg一般轉(zhuǎn)換為JSON字符串的格式傳回，要顯示出來通過JSON.parse(msg)轉(zhuǎn)換為JSON對象。

第二種用法，就是如何裝載頁面：

     $.ajax({         url: "index.html",         cache: false,         success: function(html){             $("#content").html(html);         }     });

注意此時回調(diào)函數(shù)的返回值不再是JSON字符串類型的數(shù)據(jù)了，而是html網(wǎng)頁。

做個簡陋的例子：

<div id="content" style="border: 1px solid red;width: 210px"></div>    <button onclick="turnPage('weixin.html')">微信</button>    <button onclick="turnPage('tongxunlu.html')">通訊錄</button>    <button onclick="turnPage('zhaopengyou.html')">找朋友</button>    <button onclick="turnPage('wo.html')">我</button>

function turnPage(url){    $.ajax({      type:"post",      url:url,      success:function(html){        $("#content").html(html);      }    })  }

設置一id為content的沒有定義高度的div，下有四個按鈕對應四個不同路徑。路徑值作為參數(shù)傳遞給turnPage函數(shù)，獲取指定頁面的所有內(nèi)容，將獲取的內(nèi)容裝入id為content的div中。

點擊“微信”跳轉(zhuǎn)到weixin.html頁面，其中只有一個 h1 標簽：

點擊“找朋友”跳轉(zhuǎn)到zhaopengyou.html頁面，其中只有一個 p 標簽

可以看到，jquery ajax不僅可以將頁面裝載到想要的地方，同時框架高度也是根據(jù)裝載頁面內(nèi)容的高度自動變化的，這也是用jquery ajax來裝載頁面的優(yōu)勢之一。

感謝您的瀏覽，希望能對您有所幫助。