轉(zhuǎn)載出處(http://www.cnblogs.com/linguanh/)
先說(shuō)下我的情況,大家可以對(duì)號(hào)入座(嫌無(wú)聊請(qǐng)?zhí)^(guò))
我的項(xiàng)目要求是這樣的漆腌,先從數(shù)據(jù)庫(kù)里面拿出來(lái)html標(biāo)簽,因?yàn)榧虞d到移動(dòng)端的網(wǎng)頁(yè)內(nèi)容是用戶在網(wǎng)頁(yè)編輯好了之后提交到服務(wù)器的阶冈,即網(wǎng)頁(yè)內(nèi)容是 b/s 交互闷尿,我在網(wǎng)頁(yè)前段編輯器里面設(shè)置了只保存編輯的 html 標(biāo)簽,即是沒(méi)有頭部和后面的女坑,形式是:
<html>
<body>
只保存這里的標(biāo)簽到數(shù)據(jù)庫(kù)
</body>
</html>
移動(dòng)端有兩個(gè)activity填具,這時(shí)候是 c/s 交互了,頁(yè)面一負(fù)責(zé)加載前置數(shù)據(jù)堂飞,例如一張封面圖之類的灌旧,然后用戶點(diǎn)擊進(jìn)入webView主體,我上面說(shuō)了绰筛,我的目標(biāo)html標(biāo)簽是保存到db的枢泰,所以我在第一個(gè)頁(yè)面的時(shí)候就把db里面的html下載保存到內(nèi)存了,String即可铝噩,用戶點(diǎn)擊時(shí)衡蚂,跳轉(zhuǎn)傳遞。看到這里毛甲,相信你知道我是加載到webView的了年叮,沒(méi)錯(cuò),就是組合玻募,再load只损。注意了,我這里并不是直接加在一個(gè)鏈接七咧,不是 webView.loadUrl() 是組合好 html 后再使用 loadDataWithBaseUrl跃惫。
說(shuō)下標(biāo)簽不同的影響(很重要,因?yàn)槟承┓椒▽?duì)某些表情有用)
通常艾栋,我們加載后超出屏幕寬度的一般是 img 或者 video 標(biāo)簽或者文字爆存,這類標(biāo)簽可以使用css 或者 網(wǎng)上盛行的三個(gè)設(shè)置做到適配,這三個(gè)盛行的設(shè)置是:
setting.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);
setting.setUseWideViewPort(true);
setting.setLoadWithOverviewMode(true);
我先說(shuō)明蝗砾,這三個(gè)設(shè)置不一定有效先较,android 4.4 后就很可能沒(méi)效,為什么是很可能悼粮?你都不敢確定闲勺?上面說(shuō)過(guò),和標(biāo)簽及其設(shè)置有關(guān)系矮锈。如果出現(xiàn)了 table 這種標(biāo)簽霉翔,即 table 適配屏幕,很可能css都失效苞笨,怎么辦债朵?,我就是遇到了它瀑凝,所以有了這篇文章序芦。
三種解決方法**(重點(diǎn))。針對(duì)我的自己情況粤咪,自己組合html顯示的谚中。
法一:使用 Css 適配,它比上面的三種 setting 有效寥枝,對(duì)img 和video 絕壁有效宪塔,我給出個(gè)例子:
"<style>"+
"img{" +
"max-width:100%;" +
"height:auto}" +
"video{"+
"max-width:100%;"+
"height:auto}"+
"</style>" +
法二:使用三種setting設(shè)置:
setting.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);
setting.setUseWideViewPort(true);
setting.setLoadWithOverviewMode(true);
這種方法的失敗可能性很大,但是囊拜,也可以一試
法三:使用javaScript腳本某筐,暫時(shí)給它定義成功率是 100%(因?yàn)槲矣盟鼪](méi)失效過(guò))我這里給一個(gè)例子,例如我上面說(shuō)到的 table冠跷。
"<script type=\"text/javascript\">"
"var tables = document.getElementsByTagName('table');"
// 找到table標(biāo)簽
"for(var i = 0; i<tables.length; i++){"
+
// 逐個(gè)改變
"tables[i].style.width = '100%';"
+
// 寬度改為100%
"tables[i].style.height = 'auto';"
"}"
+
"</script>"
+
看到這里南誊,你很可能會(huì)說(shuō)身诺,這和 css 有什么區(qū)別?區(qū)別可大了抄囚,我使用 css 改變table的失敗了霉赡,使用它成功了。
說(shuō)明一下: 上面使用 js 腳步適配幔托,請(qǐng)寫到 內(nèi)容加載之后穴亏,即是 <body> 內(nèi)容 <寫后面></body>,為什么呢重挑?有基礎(chǔ)的人都知道迫肖,html 是解析性語(yǔ)言,從上到下攒驰,你要先加載好 html 再使用 js 改變,除非js 包在函數(shù)里面故爵。