通過document.domain + iframe解決跨域問題

document.domain用來得到目前網頁的域名。

比如在百度（https://www.baidu.com）頁面控制台中輸入：

alert(document.domain);              //"www.baidu.com"      

我們也可以給document.domain屬性指派，不過是有限制的，你隻能賦成目前的域名或者一級域名。

比如：

alert(document.domain = "baidu.com");     //"baidu.com"
alert(document.domain = "www.baidu.com"); //"www.baidu.com"      

上面的指派都是成功的，因為www.baidu.com是目前的域名，而baidu.com是一級域名。

但是下面的指派就會出來"參數無效"的錯誤：

比如：

alert(document.domain = "qq.com");     //參數無效  報錯
alert(document.domain = "www.qq.com"); //參數無效  報錯      

因為qq.com與baidu.com的一級域名不相同，是以會有錯誤出現。

這是為了防止有人惡意修改document.domain來實作跨域偷取資料。

利用document.domain 實作跨域

前提條件：

這兩個域名必須屬于同一個一級域名!而且所用的協定，端口都要一緻，否則無法利用document.domain進行跨域。

Javascript出于對安全性的考慮，而禁止兩個或者多個不同域的頁面進行互相操作。

而相同域的頁面在互相操作的時候不會有任何問題。

1.比如：

baidu.com的一個網頁（baidu.html）裡面 利用iframe引入了一個qq.com裡的一個網頁（qq.html）。

這時在baidu.html裡面可以看到qq.html裡的内容，但是卻不能利用javascript來操作它。因為這兩個頁面屬于不同的域，在操作之前，js會檢測兩個頁面的域是否相等，如果相等，就允許其操作，如果不相等，就會拒絕操作。

這裡不可能把baidu.html與qq.html利用JS改成同一個域的。因為它們的一級域名不相等。（強制用JS将它們改成相等的域的話會報跟上面一樣的"參數無效錯誤。"）

但如果在baidu.html裡引入baidu.com裡的另一個網頁，是不會有這個問題的，因為域相等。

2.另一種情況，有兩個子域名：

news.baidu.com(news.html)

map.baidu.com(map.html)

news.baidu.com裡的一個網頁（news.html）引入了map.baidu.com裡的一個網頁（map.html）

這時news.html裡同樣是不能操作map.html裡面的内容的。

因為document.domain不一樣，一個是news.baidu.com，另一個是map.baidu.com。

這時我們就可以通過Javascript，将兩個頁面的domain改成一樣的，

需要在a.html裡與b.html裡都加入：

document.domain = “baidu.com”;

這樣這兩個頁面就可以互相操作了。也就是實作了同一一級域名之間的"跨域"。

舉個栗子

<script>.domain = 'baidu.com';
    var ifr = document.createElement('iframe');
    ifr.src = 'map.baidu.com/map.html';
    ifr.style.display = 'none';
    document.body.appendChild(ifr);
    ifr.onload = function(){
        var doc = ifr.contentDocument || ifr.contentWindow.document;
        // 這裡可以操作map.baidu.com下的map.html頁面
        var oUl = doc.getElementById('ul1');
        alert(oUl.innerHTML);
        ifr.onload = null;
    };</script>      

<ul id="ul1">我是map.baidu.com中的ul</ul>
<script>.domain = 'baidu.com';</script>