JS如何設(shè)置iOS中微信瀏覽器的title
說到web前端,瀏覽器差異是不可回避的問題,這次在項(xiàng)目就遇到下面的問題:
微信導(dǎo)航欄的內(nèi)容是直接拿的項(xiàng)目中title來設(shè)置的。但是現(xiàn)在做的項(xiàng)目是一個(gè)單頁應(yīng)用,整個(gè)頁面只會(huì)在第一次完全刷新,后面只會(huì)局部刷新,所以只能在頁面刷新的時(shí)候通過js動(dòng)態(tài)修改title。開始我們使用的做法如下:
document.title = "微信導(dǎo)航欄想要顯示的內(nèi)容"; $("title").text("微信導(dǎo)航欄想要顯示的內(nèi)容"); document.getElementsByTagName("title")[0].innerText = "微信導(dǎo)航欄想要顯示的內(nèi)容"
上面的的方法簡單方便,可惜上面的方法在安卓上面設(shè)置沒有問題,但是iOS微信瀏覽器是無效。
解決方法:
var $body = $('body'); document.title = 'the title you want to set'; var $iframe = $("<iframe style='display:none;' src='/favicon.ico'></iframe>"); $iframe.on('load',function() { setTimeout(function() { $iframe.off('load').remove(); }, 0); }).appendTo($body);
原理比較簡單,之前是因?yàn)槲⑿艦g覽器首次加載頁面初始化title后,就再也不監(jiān)聽 document.title的change事件。而這里修改title之后,給頁面加上一個(gè)內(nèi)容為空的iframe,隨后立即刪除這個(gè)iframe,這時(shí)候會(huì)刷新title。但是,在iframe加載和刪除的時(shí)候,iOS頁面會(huì)有幾毫秒的閃動(dòng)(有灰色的框),Android直接有灰色的框出現(xiàn)在頁面不消失,所以,一開始加載iframe的時(shí)候,就將該iframe的樣式設(shè)置為:display: none;這樣就解決了這個(gè)問題,同時(shí)因?yàn)閐isplay:none這個(gè)設(shè)置,iframe是脫離文本流的,那么加載和刪除這個(gè)iframe都不會(huì)改變文本流,也不會(huì)觸發(fā)頁面渲染。
以上所述是小編給大家介紹的JS如何設(shè)置iOS中微信瀏覽器的title,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
相關(guān)文章
讓javascript加載速度倍增的方法(解決JS加載速度慢的問題)
這篇文章主要介紹了讓javascript加載速度倍增的方法,通過document.write輸出js解決廣告加載速度慢的問題,需要的朋友可以參考下2014-12-12javascript中關(guān)于&& 和 || 表達(dá)式的小技巧分享
我將會(huì)介紹和解析12個(gè)簡單但是強(qiáng)大的JavaScript技巧. 這些技巧所有的JavaScript程序員都可以馬上使用, 你不需要成為JavaScript高手才能理解這些.下面我們開始本系列的第一篇文章,介紹下強(qiáng)大的&& 和 || 表達(dá)式2015-04-04原生JS實(shí)現(xiàn)九宮格抽獎(jiǎng)效果
本篇文章主要介紹了原生JS實(shí)現(xiàn)九宮格抽獎(jiǎng)效果的示例代碼。具有很好的參考價(jià)值。下面跟著小編一起來看下吧2017-04-04用javascript關(guān)閉本窗口不彈出詢問框的方法
ie中用close關(guān)閉非open打開的窗口時(shí)回彈出一個(gè)對話框詢問用戶,怎么去掉這個(gè)框呢,在window.close之前加上window.top.opener = null就可以了2014-09-09JavaScript array常用方法代碼實(shí)例詳解
這篇文章主要介紹了JavaScript array常用方法代碼實(shí)例詳解,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-09-09