現在，蘋果手機的微信網頁會出現底部返回導航欄，導致頁面的部分內容會被導航欄遮擋住。
試驗了很多次，最后是通過每次加載頁面的時候獲取頁面的實際高度，來控制網頁body體的高度。
只要在加載完成之后，添加這一句就可以避免出現內容被遮擋的情況了。
$("body").css("height",document.body.clientHeight+"px");
在后面的項目中，我發現在不設定高度的前提下，頁面內容往下滾動的時候，底部導航欄會自動隱藏，網上滾動又會出現。
大家可以嘗試下，根據實際應用情況，采用不同方法：
style樣式：
*{
margin: 0;padding: 0;
}
html,body{
position: relative;
width: 100%;
}
#content{
width: 100%;
padding-bottom: 50px;
}
.nav{
width: 100%;
height: 50px;
display: flex;
align-items: center;
position: fixed;
bottom: 0;
background: #FFFFFF;
}
.nav span{
display: inline-block;
margin: 0 auto;
}
body體代碼：
<div id="content" style=""></div>
<!--固定導航欄-->
<div class="nav"><span>導航欄</span></div>
script代碼：
window.onload = function(){
var innerHTML = '';
for(var i=0;i<50;i++){
innerHTML += '<p>測試內容</p>';
}
document.getElementById('content').innerHTML = innerHTML
}