1、華為、OPPO手機點選圖檔（需求是點選圖檔進入文章詳情頁）會先放大圖檔，關閉後才進入詳情頁。
解決辦法：在标簽裡加上οnclick="return false"即可。
2、使用h5的video标簽在移動端播放視訊的時候，視訊總是浮在最上層，優先級最高遮蓋所有dom操作。
解決方法：
（1）根據需求采用絕對定位固定上下位置。
（2）操作dom的時候隐藏視訊，操作結束顯示視訊，這樣也不會影響視訊的正常播放。
3、h5的video标簽，如果不設定controls屬性，那麼在移動端視訊無法加載。
解決方法：
（1）在頁面上加一個按鈕，點選按鈕順序調用方法.load()和.play()。注意：此方法需要在頁面手動觸發調用，在vue生命周期裡自動調用無效。
（2）給video标簽加上設定controls屬性值為真。
4、元素與元素之間盡量少使用margin，可以給元素設定padding-top來達到想要的元素間間隔距離效果。否則各個浏覽器渲染出來差别太大。
5、寫動畫最好使用requestAnimationFrame，而不是setTimeout和setInterval。
原因：
①JavaScript是單線程的，是以定時器的實作是在目前任務隊列完成後再執行定時器的回調的，如果目前隊列任務執行時間大于定時器設定的延遲時間，那麼定時器就不那麼可靠了。
②使用setTimeout和setInterval，動畫會出現抖動和卡頓現象。大多數電腦顯示器的重新整理頻率是60Hz，即每秒60次，事件間隔為16.7ms（1000/60），而由于setTimeout的設定的事件間隔不一定和螢幕重新整理的時間相同。
setTimeout和setInterval缺點：
①無法無額定正确的時間間隔（浏覽器、機器硬體的性能各不相同）。
②毫秒不精确。
③無法避免過度渲染（渲染頻率太高、tab不可見等）
requestAnimationFrame實作原理：
①注冊回調函數。
②浏覽器更新時觸發animate。
③animate會觸發所有注冊過的callback。
這裡的工作機制可以了解為所有權的轉移，把觸發幀更新的時間所有權交給浏覽器核心，與浏覽器的更新保持同步。這樣做既可以避免浏覽器更新與動畫幀更新的不同步，又可以給予浏覽器足夠大的優化空間。
requestAnimationFrame優點：
①采用系統時間間隔，保持最佳繪制效率，不會因為間隔時間過短，造成過度繪制，增加開銷；也不會因為間隔時間太長，使用動畫卡頓不流暢，讓各種網頁動畫效果能夠有一個統一的重新整理機制，進而節省系統資源，提高系統性能，改善視覺效果。
②requestAnimationFrame會把每一幀中的所有DOM操作集中起來，在一次重繪或回流中就完成，并且重繪或回流的時間間隔緊緊跟随浏覽器的重新整理頻率。
③在隐藏或不可見的元素中，requestAnimationFrame将不會進行重繪或回流，這當然就意味着更少的CPU、GPU和記憶體使用量④requestAnimationFrame是由浏覽器專門為動畫提供的API，在運作時浏覽器會自動優化方法的調用，并且如果頁面不是激活狀态下的話，動畫會自動暫停，有效節省了CPU開銷。
使用方法：
6、僞元素 :hover在iPhone上會失效
解決辦法：
監聽元素點選事件，添加class名。如下：
$('.do-item1-content1').on('touchstart', touchstart)
$('.do-item1-content1').on('touchend', touchEnd)
function touchstart(event) {
$(this).addClass('touchDiv')
}
function touchEnd(event) {
$(this).removeClass('touchDiv')
}
7、擷取滾動條高度
浏覽器擷取滾動條高度的方法：
親測：Chrome 和 Firefox隻能通過document.documentElement.scrollTop擷取，通過document.body.scrollTop擷取的永遠是0.
封裝：
function getScrollTop ( ) {
let scroll_top = 0;
if (document.documentElement && document.documentElement.scrollTop) {
scroll_top = document.documentElement.scrollTop
}else if (document.body) {
scroll_top = document.body.scrollTop
}
return scroll_top
}
8、擷取某個div元素的高度
$('.className')[0].clentHeight
例如：
<div class="contact-content-right">
<p>11111</p>
<div>222222222</div>
</div>
height = $('.contact-content-right')[0].clientHeight
9、
XHTML中用 document.documentElement.clientHeight 代替
document.body.clientHeight
https://my.oschina.net/zhenguoguan/blog/138603
JS 擷取螢幕、浏覽器、頁面的高度寬度
https://segmentfault.com/a/1190000010443608