兼容ie9不支持classList问题

网上有很多处理方案,大部分我试了都不起作用,在此记录一下我自己项目解决成功的方案。

原git项目地址:https://github.com/jwilsson/domtokenlist/blob/master/dist/domtokenlist.js

使用:下载domtokenlist.js,在ie9中引入domtokenlist.js即可

<!--[if IE 9]>      <script src="./dist/js/ie9.js"></script>  <![endif]--> 

/*! DOMTokenlist shim | Copyright 2016 Jonathan Wilsson and Bogdan Chadkin. */;typeof window !== 'undefined' && (function (window) { 'use strict'; if (!window.DOMTokenList) { return; } var el = document.createElement('a').classList; var dtp = DOMTokenList.prototype; var add = dtp.add; var remove = dtp.remove; var toggle = dtp.toggle; el.add('c1', 'c2'); // Older versions of the HTMLElement.classList spec didn't allow multiple // arguments, easy to test for var iterateArg = function (fn) { return function () { var tokens = arguments; var i; for (i = 0; i < tokens.length; i += 1) { fn.call(this, tokens[i]); } }; }; if (!el.contains('c2')) { dtp.add = iterateArg(add); dtp.remove = iterateArg(remove); } // Older versions of the spec didn't have a forcedState argument for // `toggle` either, test by checking the return value after forcing if (!el.toggle('c1', true)) { dtp.toggle = function (cls, force) { if (force === undefined) { return toggle.call(this, cls); } (force ? add : remove).call(this, cls); return !!force; }; }}(window)); ;typeof window !== 'undefined' && (function (window) { 'use strict'; var arr = []; var inArray = function (array, value) { var i; if (arr.indexOf) { return arr.indexOf.call(array, value); } for (i = 0; i < array.length; i++) { if (array[i] === value) { return i; } } return -1; }; var validateToken = function (token) { var whitespace = /[\u0009\u000A\u000C\u000D\u0020]/; if (token === '' || whitespace.test(token)) { throw new Error('Token must not be empty or contain whitespace.'); } }; var DOMTokenList = function (element, prop) { var inst = this; var i; var values = []; if (element && prop) { inst.element = element; inst.prop = prop; if (element[prop]) { values = element[prop].replace(/^\s+|\s+$/g, '').split(/\s+/); for (i = 0; i < values.length; i++) { inst[i] = values[i]; } } } inst.length = values.length; }; DOMTokenList.prototype = { add: function () { var inst = this; var i; var tokens = arguments; for (i = 0; i < tokens.length; i++) { validateToken(tokens[i]); if (!inst.contains(tokens[i])) { arr.push.call(inst, tokens[i]); } } if (inst.element) { inst.element[inst.prop] = inst; } }, contains: function (token) { validateToken(token); return inArray(this, token) !== -1; }, item: function (index) { return this[index] || null; }, remove: function () { var tokens = arguments; var inst = this; var key; var i; for (i = 0; i < tokens.length; i++) { validateToken(tokens[i]); key = inArray(inst, tokens[i]); if (key !== -1) { arr.splice.call(inst, key, 1); } } if (inst.element) { inst.element[inst.prop] = inst; } }, toggle: function (token, force) { var inst = this; if (inst.contains(token)) { if (force) { return true; } inst.remove(token); return false; } else { if (force === false) { return false; } inst.add(token); return true; } }, toString: function () { return arr.join.call(this, ' '); } }; window.DOMTokenList = DOMTokenList;}(window)); ;typeof window !== 'undefined' && (function () { 'use strict'; if ('classList' in document.createElement('a')) { return; } Object.defineProperty(Element.prototype, 'classList', { get: function () { return new DOMTokenList(this, 'className'); } });}()); ;typeof window !== 'undefined' && (function () { 'use strict'; if ('relList' in document.createElement('a')) { return; } var i; var elements = [HTMLAnchorElement, HTMLAreaElement, HTMLLinkElement]; var getter = function () { return new DOMTokenList(this, 'rel'); }; for (i = 0; i < elements.length; i++) { Object.defineProperty(elements[i].prototype, 'relList', { get: getter }); }}()); ;typeof window !== 'undefined' && (function () { 'use strict'; if (typeof SVGElement === 'undefined') { // IE8 does not support SVG and would throw // "Object doesn't support this method or property" return; } // https://connect.microsoft.com/IE/feedback/details/1046039/classlist-not-working-on-svg-elements var svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"); if ('classList' in svg && !window.QUnit) { return; } Object.defineProperty(SVGElement.prototype, 'classList', { get: function () { if (typeof this.className === 'string') { return new DOMTokenList(this, 'className'); } // in SVG world className may not be a DOMString, but a SVGAnimatedString // https://developer.mozilla.org/en-US/docs/Web/API/SVGAnimatedString if (typeof this.className.baseVal === 'string') { return new DOMTokenList(this.className, 'baseVal'); } } });}());

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 216,163评论 6 498
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,301评论 3 392
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 162,089评论 0 352
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,093评论 1 292
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,110评论 6 388
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,079评论 1 295
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,005评论 3 417
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,840评论 0 273
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,278评论 1 310
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,497评论 2 332
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,667评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,394评论 5 343
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,980评论 3 325
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,628评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,796评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,649评论 2 368
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,548评论 2 352