الحجم التكيفي iframe

ينتمي المجال A.HTML إلى الصفحة الرئيسية A: www.taobao.com

المجال B الذي ينتمي إليه صفحة iframed B.HTML: www.alimama.com ، بافتراض العنوان: http://www.alimama.com/B.HTML

يتم تضمين الصفحة تحت اسم المجال A.HTML في الصفحة B.HTML تحت اسم المجال B من خلال iframe. نظرًا لأن عرض وارتفاع B.HTML غير متوقع وسيتغير ، يلزم الحجم التكيفي لـ iframe في A.HTML.

مشكلة الوصول إلى IFRame المتقاطع في JS ، لأنه للتحكم في ارتفاع وعرض iframe في A.HTML ، يجب أولاً قراءة حجم B.HTML. A و B لا ينتميان إلى نفس المجال. لأسباب أمنية ، يقيد المتصفح الوصول عبر المجال إلى JS ولا يمكنه قراءة ارتفاع وعرض B.HTML.

تنتمي صفحة الوكيل الوكيل C.HTML إلى نفس المجال A و A.HTML. C.HTML هي صفحة الوكيل الوسيطة المقدمة ضمن المجال A. افترض أن عنوان C.HTML هو: www.taobao.com/c.html ، وهو المسؤول عن قراءة قيم العرض والارتفاع في الموقع.

رمز A.HTML

أولاً ، تم تقديم B.HTML من خلال iframe في A.HTML

<iframe id = b_iframe height = 0 ′ width = 0 ′ src = http: //www.alimama.com/b.html frameBorder = no border = 0px marginWidth = 0 ′ marginheight = 0 ′ scrolling = no lowtransparency = yes> </frame>

رمز B.HTML

<script type = text/javaScript>

var b_width = math.max (document.documentElement.ClientWidth ، document.body.clientwidth) ؛

var b_height = math.max (document.documentElement.clientheight ، document.body.clientheight) ؛

var c_iframe = document.getElementById (c_iframe) ؛

c_iframe.src = c_iframe.src+#+b_width+|+b_height ؛ //http://www.taobao.com/c.html#width| outheight

}

</script>

<!-يقرأ JS عرض وارتفاع B.HTML ، ويحدد عرض وارتفاع القراءة إلى صفحة الوكيل الأوسط لـ C.HTML في نفس المجال ، ويحدد عرض وارتفاع القراءة إلى تجزئة SRC of C.HTML->

<iframe id = c_iframe height = 0 ′ width = 0 ′ src = http: //www.taobao.com/c.html style = display: none> </frame>

C.HTML رمز

<script type = text/javaScript>

var b_iframe = parent.parent.document.getElementById (b_iframe) ؛

var hash_url = window.location.hash ؛

var hash_width = hash_url.split (#) [1] .Split (|) [0]+px ؛

var hash_height = hash_url.split (#) [1] .Split (|) [1]+px ؛

b_iframe.style.width = hash_width ؛

b_iframe.style.height = hash_height ؛

</script>

يمكن أن يتكيف iframe في A.HTML مع عرض وارتفاع B.HTML.

يمكن أيضًا حل مشاكل التشغيل عبر المجال المتقاطع المشابهة لـ JS وفقًا لهذه الفكرة