成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

IE 兼容模式 設(shè)置 Meta Compatible 和 Iframe 子頁面的關(guān)系

番茄西紅柿 / 3496人閱讀

摘要:也能使用更復(fù)雜的,更頁面增加更強(qiáng)的效果。這是因?yàn)楫?dāng)頂級頁面設(shè)置為或,里面的頁面設(shè)置不起作用,它的文檔模式顯示的是。參考參考使用來搞定瀏覽器兼容模式強(qiáng)制標(biāo)準(zhǔn)模式標(biāo)準(zhǔn)模式與兼容模式設(shè)置

背景

因?yàn)闅v史原因,之前很多的系統(tǒng)都會(huì)是 頂級頁面+Iframe來加載子級頁面的這種模式構(gòu)件系統(tǒng),而且系統(tǒng)都只能運(yùn)行在IE6或者IE 高版本兼容模式下(IE 7模式)。 隨著現(xiàn)在的審美原來越高,腳本能里越來越強(qiáng),無論是用戶和是軟件商都希望能系統(tǒng)升級,那么在升級的過程中,肯定是要保證原有的系統(tǒng)能正常運(yùn)行的。

通常的做法會(huì)是如下:

將頁面利用 html meta標(biāo)簽,設(shè)置Compatible屬性,來使得無論用戶是否設(shè)置了兼容模式,都讓當(dāng)前網(wǎng)頁強(qiáng)勢使用最高版本瀏覽器模式,這樣可以讓我們界面利用一些css3的特性做出性能更好,更漂亮的網(wǎng)頁。也能使用更復(fù)雜的JS,更頁面增加更強(qiáng)的效果。

那么可能會(huì)遇到以下幾種情況:

  1. 頂級頁面設(shè)置了Compatible, IE=Edge。 你會(huì)發(fā)現(xiàn)原來系統(tǒng)iframe能正常的網(wǎng)頁,在你新的頁面中運(yùn)行不正常了,即便開啟了兼容模式,或者iframe里面的網(wǎng)頁設(shè)置了 Compatible, IE=EmulateIE7。你的頁面依然瀏覽不正常。
  2. 要解決上面的問題,就是頂級頁面不能設(shè)置Compatible, IE=Edge,你可以設(shè)置頂級頁面的Compatible, IE=EmulateIE8或IE=EmulateIE7,則可以讓iframe里面的網(wǎng)頁瀏覽正常。
  3. 使用了第2步驟的解決方案,你會(huì)發(fā)現(xiàn),當(dāng)你新做的網(wǎng)頁,里面用到了css3或者高版本的腳本庫如(vue.js),在測試IE9中很正常,但是將網(wǎng)頁簽入到iframe中后,頁面不正常,或者腳本報(bào)錯(cuò)。這是因?yàn)楫?dāng)頂級頁面設(shè)置為IE=EmulateIE8或IE=EmulateIE7,iframe里面的頁面設(shè)置IE=edge不起作用,它的文檔模式顯示的是IE8。

為什么會(huì)出現(xiàn)這種情況呢?

原因和解釋

stackoverflow的一個(gè)問題《Trying to use IE=edge X-UA-Compatible in an iframe on a page using IE=EmulateIE7》, 有人給出了答案:

IE does not allow mixing IE9+ and older modes in a frame hierarchy. If your top document is IE7, the highest you can get in any inner document is IE8. Similarly, you wouldnt be able to host anything but IE9 mode docs inside an IE9 mode page.

上面的答案很通俗易懂,翻下大意如下:

在IE中不允許IE9+的模式和舊模式混合,如果頂級頁面的文檔模式是IE7,則你在iframe中的頁面最高級的文檔模式是IE8,同樣,頂級頁面的模式是IE9+,則iframe中的頁面文檔模式不可能低于IE9 以下。

這個(gè)答案和上面我們遇到的問題是完美契合的,我們也可以寫一些例子來證明這個(gè)答案,【例子 】放在附件中,可以下載更改Compatible測試驗(yàn)證下。

csdn上也有人遇到了,這個(gè)問題,有同學(xué)回答和上面的一致,直通車《能不能讓iframe內(nèi)外的頁面用不同的文檔模式解析》。

結(jié)論

當(dāng)遇到背景當(dāng)中的問題時(shí),目前好像無解,只能設(shè)置頂級的網(wǎng)頁最高為IE8,然后所有的系統(tǒng)都必須兼容IE8模式,想不支持IE8模式,只能當(dāng)做外鏈來打開。所有如果要支持前有的系統(tǒng),無論再過多少年,前端技術(shù)如何發(fā)展,你新做的系統(tǒng),技術(shù)上也只能限定在IE8支持才情況下。

該如何考量這個(gè)問題,還需要從業(yè)務(wù)、和遷移策略上改變,可以考慮如下幾種方式:

  1. 升級頂級的頁面支持最高版本瀏覽器支持,那些需要兼容模式才能運(yùn)行的系統(tǒng),考慮是否使用外鏈的方式打開。
  2. 保留原有的頂級頁面,做一個(gè)新的頂級頁面,在頂級頁面打開的那些系統(tǒng)時(shí),提示用戶去舊的平臺(tái)打開,并給出鏈接,這種做法會(huì)失去一些用戶體驗(yàn),怎么樣盡量讓用戶體驗(yàn)更好,就要發(fā)揮各自的聰明才智了。
  3. 直接使用兩個(gè)平臺(tái),一個(gè)平臺(tái)是就有的系統(tǒng),一個(gè)平臺(tái)是新的系統(tǒng)。

各位看官,有什么好的想法可以提提。

參考:

  1. Specifying legacy document modes
  2. Trying to use IE=edge X-UA-Compatible in an iframe on a page using IE=EmulateIE7
  3. 使用X-UA-Compatible來搞定IE瀏覽器兼容模式
  4. IE強(qiáng)制標(biāo)準(zhǔn)模式---標(biāo)準(zhǔn)模式與兼容模式設(shè)置

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/2015.html

相關(guān)文章

  • meta標(biāo)簽http-equiv與content解析

    摘要:幼圓屬性幼圓幼圓無論頁面是否包含指令,均使用的標(biāo)準(zhǔn)渲染模式。對于多數(shù)網(wǎng)站來說,它是首選的兼容性模式幼圓幼圓模式通知以最高級別的可用模式顯示內(nèi)容,這實(shí)際上破壞了鎖定模式。meta是html語言head區(qū)的一個(gè)輔助性標(biāo)簽,以下是meta的http-equiv屬性和content屬性的一些介紹。 http-equiv屬性   指示服務(wù)器在發(fā)送實(shí)際的文檔之前,要在傳送給瀏覽器的 MIME 文檔頭部包...

    FWHeart 評論0 收藏0
  • <meta http-equiv="X-UA-Compatible" co

    摘要:對于及以上版本,例如強(qiáng)制瀏覽器按照特定的版本標(biāo)準(zhǔn)進(jìn)行渲染。但不支持及以下版本。盡管在真實(shí)情況中,你只要選擇一種版本這對于測試和維護(hù)會(huì)更加簡單。為了避免制作出的頁面在下面出現(xiàn)錯(cuò)誤,建議直接將使用進(jìn)行渲染。本人對該知識(shí)點(diǎn)了解不深,本文采用Victor,再進(jìn)一步!的文章,如果有人看到本頁,請直接進(jìn)入https://www.cnblogs.com/victor5230/p/5846832.html,...

    Seay 評論0 收藏0
  • 360瀏覽器使用meta標(biāo)簽強(qiáng)制使用指定內(nèi)核

    摘要:目前,瀏覽器可以使用進(jìn)行設(shè)置,強(qiáng)制使用指定內(nèi)核打開頁面,方法如下的取值為之一,區(qū)分大小寫,分別代表用內(nèi)核,兼容內(nèi)核,標(biāo)準(zhǔn)內(nèi)核。 目前國內(nèi)主流瀏覽器多為雙核瀏覽器,基于開發(fā)成本和效果考慮,兼容模式實(shí)在頭疼。目前,360瀏覽器可以使用meta進(jìn)行設(shè)置,強(qiáng)制使用指定內(nèi)核打開頁面,方法如下: //content的取值為webkit,ie-comp,ie-stand之一,區(qū)分大小寫,分別代表...

    Charles 評論0 收藏0
  • 面試信心來源于過硬基礎(chǔ)

    摘要:避免在頁面的主體布局中使用,要等其中的內(nèi)容完全下載之后才會(huì)顯示出來,顯示比布局慢。實(shí)現(xiàn)多行文本溢出顯示效果實(shí)現(xiàn)方法適用范圍因使用了的擴(kuò)展屬性,該方法適用于瀏覽器及移動(dòng)端 在過去的一年很多人不滿于公司沒有福利、人際關(guān)系不好相處、沒有發(fā)展前途的境遇等等,想著在開年來換一份工作來重新開始自己,那么 你 準(zhǔn)備好了嗎? 下面是本人整理的一份面試材料,本想自己用的,但是新年第一天 公司突然給了我個(gè)...

    Ashin 評論0 收藏0

發(fā)表評論

0條評論

最新活動(dòng)
閱讀需要支付1元查看
<