JSドメイン間問題.

14248 ワード

js。

       ，          tx  ，               google    ，    ， 。。   css，css         ， js    。。          js

   。。   。。


 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title> </title>

    <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
</head>

<body>            
               
                <table id="Calendar1_entryCal"><tr><td>234234234</td></tr></table>
                <iframe name="fname" id="fname" frameborder="0" scrolling="no" src="http://show.v.t.qq.com/index.php?c=show&a=index&n=m184394282&w=0&h=508&fl=1&l=30&o=1&co=4&cs=4252_202_9C85_BC6" width="100%" height="400"></iframe>
                <div id="wb"></div>
</body>

</html>
    <script type="text/javascript">
        window.onload =function () {
            //            var test = $("#Calendar1_entryCal");
//            test.hide();
//            test.before().append
//        $("#userInfo + p").removeAttr("style");
//        $(window.frames["fname"].document).find(".userInfo:eq(0) > p").removeAttr("style");

          
       
            alert($(document.getElementById('fname').contentWindow.document.body).html());//


            alert($(window.frames["fname"].document).html());
            alert($(window.frames["fname"].document).find($(".userInfo:eq(0) > p")));
            alert($(window.frames["fname"].document).find($(".userInfo:eq(0) > p")).attr("style"));
        }           
</script>

シナリオ1、クリップボード

原理:IE自体がwindowsプラットフォームに依存する特性はiframeに基づいて、メモリを利用して「迂回」する方案を提供して、ここで私は、ローカルストレージ原理と呼ぶ.
欠点:非IEブラウザをサポートしないで、しかもユーザーのクリップボードに対する操作に影響して、ユーザーの体験はとてもよくなくて、特にIE 7の下で、安全等級の影響を受けて、プロンプトボックスを弾き出すことができます.
デモ:[ここをクリックして閲覧する]
サブページはサブドメイン:demo.ioldfish.cnでは、ページに次のコードを加えてページの高さを取得し、クリップボードに格納します.

var ua = navigator.userAgent;

if ((i = ua.indexOf("MSIE")) >= 0)

{

var iObjH = window.document.documentElement.scrollHeight;

window.clipboardData.setData('text',String(iObjH));

}

ホームページはメインドメイン:www.ioldfish.cnでは、クリップボードの値を取得し、サブページがあるiframeの高さに値を付けるコードをページに追加します.

window.onload = function()

{

var iObj =document.getElementById('iId');

iObj.style.height=parseInt(window.clipboardData.getData('text'))+'px';

}

方案二、document.domain

原理:documentが設定されています.domain、ブラウザをだます
欠点:異なるプライマリドメイン間の通信が実現できません.また、1つのページに他のiframeが含まれている場合、セキュリティ異常が発生し、アクセスが拒否されます.
デモ:[ここをクリックして閲覧する]
ホームページはメインドメイン:www.ioldfish.cnの下で、サブページはサブドメイン:demo.ioldfish.cnでは、2つのページのヘッダに次のコードを追加します.

document.domain="ioldfish.cn";

シナリオ3、JSでhash値を取得して通信を実現する

原理:hashはドメイン間通信を実現することができる.
欠点:親ウィンドウのURLパラメータが動的に生成される場合、処理プロセスは複雑です.またIE以外のブラウザでhashの変更に遭遇すると履歴が記録され、ブラウザの前進後退機能に影響し、体験が悪い.
デモ:[ここをクリックして閲覧する]
サブページはメインドメイン:www.lzdaily.comでは、ページに次のコードを追加します.hashはドメイン間の制限を受けないので、本ページの高さをホームページのhashにスムーズに転送できます.

var hashH = document.documentElement.scrollHeight;

var urlA = "http://www.ioldfish.cn/wp-content/demo/domain/hash/a2.html";

parent.location.href= urlA+"#"+hashH;

ホームページはメインドメイン:www.ioldfish.cnでは,ページに次のコードを追加し,まずサブページから渡されたhash値を取得し,次にhash値をサブページが存在するiframeの高さに割り当てる.

window.onload = function()

{

var iObj = document.getElementById('iId');

if(location.hash)

{

iObj.style.height=location.hash.split("#")[1]+"px";

}

方案四、hash値を伝達して通信改良版を実現する

原理:このスキームは「フロントエンドエージェント」方式によりhashの伝値を実現し,体験的にスキーム3より大きく向上した.
欠点:親ウィンドウのURLパラメータが動的に生成される場合、処理プロセスは複雑です.
デモ:[ここをクリックして閲覧する]
サブページはメインドメイン:www.lzdaily.comでは、ページに次のコードを追加し、まずページにホームページと同じドメインのiframe〔動的に生成することもできる〕を追加します.彼の役割はジャンプボードのようです.Cページには何のコードも必要なく、ページがあることを確認すれば404エラーを防ぐことができます!この方法はiframeのname値を修正することによって同様にドメイン間で値を伝達することができ,ただ「わいせつ」を比較するだけである.

そしてページに次のようなコードを付け,ページCのURLを利用してhash値を受信し,hash値を同ドメイン下のホームページに伝える役割を果たす.

hashH = document.documentElement.scrollHeight;

urlC = "http://www.ioldfish.cn/wp-content/demo/domain/hashbetter/c.html";

document.getElementById("iframeC").src=urlC+"#"+hashH;

ホームページはメインドメイン:www.ioldfish.cnでは,ページに次のコードを追加し,Cページから渡されたhash値を取得する.ここでは,Aページから直接frames["iId"]を用いるテクニックを適用する.frames["iframeC"].location.hashは、Cページのhash値に直接アクセスして取得することができます.これにより,エージェントページを介してhash値を渡すことは,シナリオ3よりもユーザ体験を大幅に向上させる.

window.onload = function()

{

var iObj = document.getElementById('iId');

iObjH = frames["iId"].frames["iframeC"].location.hash;

iObj.style.height = iObjH.split("#")[1]+"px";

}

js cssプロパティの変更

Asp.Netコントロール値を空にする方法(コントロールタイプをカスタマイズ可能)