初體驗ajax跨域

　　之前一直以為ajax是不能跨域的，從來也沒嘗試過。今天體驗了一下ajax跨域請求資料，分享一樣。

　　公司做了一個純靜態HTML的網站，可是公司領導說讓加公告，因為我們的後台管理系統和靜態頁面在不同的伺服器上，不同的網域名稱，而HTML伺服器也沒有PHP環境，這就需要兩個域之間的資料交換。討論了下各種的實現方式，淘汰了iframe，後來用script載入技術。具體如下：

<script src="http://www.baidu.com"></script>

　　這個實現方法有一個局限性，如果需要傳遞參數怎麼辦？例如：http://localhost/test/index.php?id=3

　　首先這是一個HTML純靜態頁面，只能用JS來擷取get參數。

　　JS擷取get參數，去網上搜了下，代碼如下：

    var url=document.URL;    var para='';    if(url.lastIndexOf("?")>0)    {        para=url.substring(url.lastIndexOf("?")+1,url.length);        var arr=para.split("&");        para="";        for(var i=0;i<arr.length;i++)        {           para = arr[i].split("=")[1];        }        //para 為第一個參數的值    ｝

　　擷取了參數的值，拼裝成我們要載入的連結，這樣貌似就可以實現我們的功能了。

　　其實則不然。我們實現的方法在於用javascript載入遠程連結。但是在載入之前我們需要獲得參數的值來確定連結（例：http://localhost/test/index.php?id=3），但是瀏覽器的工作機制是先載入完HTML才開始運行JS的指令碼，前後順序矛盾，所以這種實現辦法宣告失敗！

　　記得之前做過一個項目，類似於擷取新浪股票的資料，然後即時顯示。這個就用到了ajax的跨域。

　　後來去網上搜了一下，發現JQuery對於Ajax的跨域請求有兩類解決方案，不過都是只支援get方式。分別是JQuery的 jquery.ajax jsonp格式和jquery.getScript方式。（http://www.open-open.com/lib/view/open1334026513327.html）

　　新浪股票擷取方式就是用到script的方式。

        $.ajax({            url:"http://localhost/index.php?id="+para,            dataType:"script",            cache:"false",            type:"GET",            success:function(a){                $("#title").html(announce_title);                $("#date").html(announce_date);                $("#content").html(announce_content);            }        }); 

　　而http://localhost/index.php?id=3列印出來是這種格式的

　　

var announce_title="mytitle"; var announce_date="2013-04-17 13:36:15"; var announce_content="this is a test";

　　所以在遠程只要輸出上面這樣的資料格式，就可以實現html和系統間的資料交換了。

　　又漲姿勢了。