使用過“富文字編輯器”的朋友可能知道，在編輯器裡面所寫的內容，如果有樣式修改，在網頁顯示的時候，可能跟自己所寫的內容有較大區別。原因在於頁面上定義過了全域CSS。那麼如何躲避全域CSS呢？可以使用iframe處理之。。。。。
參考例子如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><br /><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh" lang="zh" dir="ltr"><br /><head><br /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></p><p> <title>iframe躲避全域CSS樣式</title><br /> <script src="http://code.jquery.com/jquery-latest.min.js"></script><br /> <script type="text/javascript"><br /> $(function(){<br /> var contents = $(":hidden[name=contents]").val();<br /> $("#ifeContents").contents().find("body").append(contents);<br /> //iframe自動適應常值內容高度<br /> window.setInterval("reinitIframe()", 200);<br /> });<br /> /**<br /> * reinitIframe<br /> *<br /> * @return void<br /> */<br /> function reinitIframe() {<br /> var iframe = $("#ifeContents")[0];<br /> var bHeight = iframe.contentWindow.document.body.scrollHeight;<br /> var dHeight = iframe.contentWindow.document.documentElement.scrollHeight;<br /> var height = Math.max(bHeight, dHeight);<br /> iframe.height = height;<br /> }</p><p> </script></p><p></head><br /><body><br /><form name="frm" method="post"><br /><input name="contents" type="hidden" value="測試資料測試資料測試資料"/><br /> <iframe id="ifeContents" frameborder="0" allowtransparency="true" tabindex="0" src="" style="width: 100%;" scrolling="auto"></iframe><br /></form><br /></body><br /></html>
PS：
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
