兼容requestAnimationFrame

let lastTime = 0
let vendors = ['ms', 'moz', 'webkit', 'o']
for (let x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
window.requestAnimationFrame = window[vendors[x] + 'RequestAnimationFrame']
window.cancelAnimationFrame = window[vendors[x] + 'CancelAnimationFrame'] || window[vendors[x] + 'CancelRequestAnimationFrame']
}
if (!window.requestAnimationFrame) {
window.requestAnimationFrame = function (callback, element) {
let currTime = new Date().getTime()
let timeToCall = Math.max(0, 16 - (currTime - lastTime))
let callbackParams = currTime + timeToCall
let id = window.setTimeout(() => { callback(callbackParams) }, timeToCall)
lastTime = currTime + timeToCall
return id
}
}
if (!window.cancelAnimationFrame) {
window.cancelAnimationFrame = function (id) {
clearTimeout(id)
}
}

兼容classList

if (!('classList' in document.documentElement)) {
Object.defineProperty(HTMLElement.prototype, 'classList', {
get: function () {
let self = this
function update (fn) {
return function (value) {
let classes = self.className.split(/s+/g)
let index = classes.indexOf(value)
fn(classes, index, value)
self.className = classes.join(' ')
}
}
return {
add: update(function (classes, index, value) {
if (!~index) classes.push(value)
}),
remove: update(function (classes, index) {
if (~index) classes.splice(index, 1)
}),
toggle: update(function (classes, index, value) {
if (~index) { classes.splice(index, 1) } else { classes.push(value) }
}),
contains: function (value) {
return !!~self.className.split(/s+/g).indexOf(value)
},
item: function (i) {
return self.className.split(/s+/g)[i] || null
}
}
}
})
}

兼容dataset

if (window.HTMLElement) {
if (Object.getOwnPropertyNames(HTMLElement.prototype).indexOf('dataset') === -1) {
Object.defineProperty(HTMLElement.prototype, 'dataset', {
get: function () {
let attributes = this.attributes // 获取节点的所有属性
let name = []
let value = [] // 定义两个数组保存属性名和属性值
let obj = {} // 定义一个空对象
for (let i = 0; i < attributes.length; i++) { // 遍历节点的所有属性
if (attributes[i].nodeName.slice(0, 5) === 'data-') { // 如果属性名的前面5个字符符合"data-"
// 取出属性名的"data-"的后面的字符串放入name数组中
name.push(attributes[i].nodeName.slice(5))
// 取出对应的属性值放入value数组中
value.push(attributes[i].nodeValue)
}
}
for (let j = 0; j < name.length; j++) { // 遍历name和value数组
obj[name[j]] = value[j] // 将属性名和属性值保存到obj中
}
return obj // 返回对象
}
})
}
}

参考: iview在ie9及以上的兼容问题解决方案

iview在ie9及以上的兼容问题解决方案的更多相关文章

  1. ie9及以下不兼容event.target.dataset对象

    ie9及以下不兼容event.target.dataset对象,请使用event.target.getAttribute('data-xxx')

  2. jquery remove()不兼容问题解决方案

      jquery remove()不兼容问题解决方案 CreationTime--2018年7月27日10点19分 Author:Marydon 1.情景展示 点击关闭,将这个div移除掉 源码展示 ...

  3. javascript window.showModalDialog不兼容goole解决方案

    window.showModalDialog不兼容goole解决方案 一.弹框方案: 1.window.open; 2.window.showModalDialog; 3.div制作窗口:(本节忽略) ...

  4. MUI - sortable在mui.js前端框架不兼容的解决方案

    关于sortable看这 兼容的解决方案看这 http://www.cnblogs.com/phillyx/ 示例代码已更到github

  5. ie9下网页设计兼容模式

    个人实践使用:ie9下使用低版本ie兼容模式,在网站第一个页面的<head>标签后使用<meta http-equiv="X-UA-Compatible" con ...

  6. IE9 以下版本浏览器兼容HTML5的方法,使用百度静态资源的html5shiv包

    <!--[if lt IE9]> <script src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.j ...

  7. 上传图片转为base64格式预览并压缩图片(不兼容IE9以下浏览器,兼容移动端ios,android)

    前些天公司要求在微信移动端做上传图片并预览的功能,要求能够调用摄像头拍照并立即预览. 在网上搜了一些方法,开始自己写了个简单的功能实现代码.结果发现移动端拍照出来的图片动不动就2M+,又因为要批量上传 ...

  8. Vue(SPA) WebPack模块化打包、SEO优化(Vue SSR服务端同构直出)、全浏览器兼容完整解决方案

    白驹过隙,时光荏苒 大概去年这个时候写了angular 结合webpack的一套前端方案,今年此时祭出vue2结合webpack的一套前端方案. 明年的这个时候我又是在做什么... 读在最前面: 1. ...

  9. html5 placeholder ie 不兼容问题 解决方案

    解决HTML5 placeholder的方案 来源:   时间:2013-09-05 20:06:49   阅读数:11375 分享到: 0 [导读] 使低版本浏览器支持Placeholder有很多方 ...

随机推荐

  1. JAVA日志发展史

    JAVA日志发展史 第一阶段 2001年以前,Java是没有日志库的,打印日志全凭System.out和System.err 缺点: 产生大量的IO操作同时在生产环境中无法合理的控制是否需要输出 输出 ...

  2. [BUUCTF]PWN——babyheap_0ctf_2017

    [BUUCTF]PWN--babyheap_0ctf_2017 附件 步骤: 例行检查,64位,保护全开 试运行一下程序,看到这个布局菜单,知道了这是一道堆的题目,第一次接触堆的小伙伴可以去看一下这个 ...

  3. [BUUCTF]REVERSE——findit

    findit 步骤: apk文件,直接用apkide打开,找到findit文件 查看了所有的函数,没找到有关flag的线索,但是找到了一串奇怪的16进制 将第一串转换一下,感觉第二串应该是flag 拿 ...

  4. 选择…Select…(Power Query 之 M 语言)

    选择行: 筛选Table.SelectRows-文本与数值 筛选Table.SelectRows-日期与时间 保留错误行:= Table.SelectRowsWithErrors( 表, {" ...

  5. 3、回溯算法解题套路框架——Go语言版

    前情提示:Go语言学习者.本文参考https://labuladong.gitee.io/algo,代码自己参考抒写,若有不妥之处,感谢指正 关于golang算法文章,为了便于下载和整理,都已开源放在 ...

  6. LuoguP4759 [CERC2014]Sums 题解

    Content 给定 \(t\) 组数据,每组数据给定一个数 \(n\),判断 \(n\) 是否能够分解成连续正整数和,能的话给出最小数最大的方案. 数据范围:\(1\leqslant n\leqsl ...

  7. socket网络编程基础模块

    更多功能 sk = socket.socket(socket.AF_INET,socket.SOCK_STREAM,0) 参数一:地址簇 socket.AF_INET IPv4(默认) socket. ...

  8. UEditor富文本判断是否输入内容

    <textarea name="CONTENT" id="CONTENT" maxlength="4000" style=" ...

  9. 【LeetCode】42. Trapping Rain Water 接雨水 (C++)

    作者: 负雪明烛 id: fuxuemingzhu 个人博客:http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 暴力求解 保存左右最大值 单调栈 日期 题目地址:ht ...

  10. 【LeetCode】813. Largest Sum of Averages 解题报告(Python)

    [LeetCode]813. Largest Sum of Averages 解题报告(Python) 标签(空格分隔): LeetCode 作者: 负雪明烛 id: fuxuemingzhu 个人博 ...