IE8兼容性问题的解决方案
前幾天，面試到Ie8的一些兼容問題，傻眼了，回想自己做了將近2年的移動端項目，ie兼容似乎沒怎么做過。所以私下便開始找找ie兼容的視頻或者文章學(xué)習(xí)，唉，還是不買書了，家里那么多書，都沒看過呢，好了，開始發(fā)一波福利：
一、HTML5標簽兼容方案：html5shiv.js
GitHub地址：https://github.com/aFarkas/html5shiv/
IE8不支持HTML5的新標簽，如<header>、<nav>等在IE8無法渲染，html5shiv.js 可幫助IE6-8瀏覽器兼容HTML5語義化標簽
?
使用方法：在頁面中引用html5shiv.js文件。必須添加在頁面的<head>元素內(nèi)，因為IE瀏覽器必須在元素解析前知道這個元素，所以這個js文件不能在頁面底部引用。
?
二、CSS3媒體查詢兼容方案：Respond.js
GitHub地址：https://github.com/scottjehl/Respond
IE8不支持css3媒體查詢，對響應(yīng)式布局大大不利，Respond.js可幫助IE6-8兼容“min/max-width”媒體查詢條件
使用方法：在頁面中所有css文件的引用位置之后引用Respond.js。而且Respond.js的引用得越早，用戶看到頁面閃爍的機會越小。
?
三、CSS3字體單位“rem”兼容方案：rem.js
GitHub地址：https://github.com/chuckcarpenter/REM-unit-polyfill
css3引入了新的字體大小單位rem，與em的“相對于其父元素來設(shè)置字體大小”的功能不同，rem是相對于根元素<html>的字體大小比率單位，成了目前的主流單位之一，IE9+開始支持，IE8就只能通過引入js庫來支持了，
使用方法：在頁面中引用rem.js文件。需要引用在頁腳，也就是<body>末尾，在所有css文件引用和DOM元素之后。
?
四、CSS3“background-size”屬性的“cover”和“contain”屬性值兼容方案：background-size polyfill
GitHub地址：https://github.com/louisremi/background-size-polyfill
具體使用方法，一看便知
?
五、JS數(shù)組的forEach方法兼容方案：自行實現(xiàn)
IE8的數(shù)組對象沒有forEach方法，所以自行聲明即可，代碼如下：
?
?
if ( !Array.prototype.forEach) {
? Array.prototype.forEach = function froEach (callback, thisArg) {
? ? ? if (this == null) {
? ? ? ? ?throw new TypeError("this is null or not defined")
? ? ?}
? ? ?let o = Object(this)
? ? ?let len = o.length >>> 0 (無符號右移0位)
? ? ?if ( typeof callback !== 'function') {
? ? ? ?throw new TypeError( callback + " is? not a function")?
? ? ?}
? ? ?let k = 0, t;
? ? ?if ( argument.length > 1 ) {
? ? ? ? t = thisArg
? ? ?}
? ? ?while (k < len) {
? ? ? ? ? let kValue;
? ? ? ? ? if ( k in o) {
? ? ? ? ? ? ?kValue = o[k]
? ? ? ? ? ? ?callback.call(T, kValue, k , o)
? ? ? ? ? }
? ? ? ? ? k++
? ? ?}
? ?}
}
目前先寫一個，日后再做補充
?
轉(zhuǎn)載于:https://www.cnblogs.com/xiaominsweet/p/9182173.html
總結(jié)
以上是生活随笔為你收集整理的IE8兼容性问题的解决方案的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 垃圾分类有几种
- 下一篇： DHCP服务（dhcpd）