共计 1654 个字符，预计需要花费 5 分钟才能阅读完成。
总共写了四篇文章（都是自己的一些拙见，仅供参考，请多多指教，我这边也会持续修正加更新）
介绍一下 snabbdom 基本用法
介绍一下 snabbdom 渲染原理
介绍一下 snabddom 的 diff 算法和对 key 值的认识
介绍一下对于兼容 IE8 的修改
这篇主要是记录一下针对 ie8 做了哪些修改
增加 polyfill.js 用来兼容某些功能函数，例如 addeventliostener,forEach 等
将每个文件单独用对象封装供其他文件使用
举例：
导出
//a.js
aModule={};
(function(aModule){
aModule.init=function(){}
})(aModule)
导入
<script type=”text/javascript” src=”a.js”></script>
var init=aModule.init;
class.js(IE8 没有 classList 属性)
elm.classList.remove(name); // 兼容 IE8
改为：
if (elm.classList) {
elm.classList.remove(name);
} else {// 兼容 IE8
elm.className = elm.className.replace(name, “”);
}
elm.classList[cur ? ‘add’ : ‘remove’](name);
改为:
if (elm.classList) {
elm.classList[cur ? ‘add’ : ‘remove’](name);
} else {// 兼容 IE8
if (cur) {//add
elm.className += ‘ ‘ + name;
} else {//remove
elm.className = elm.className.replace(name, “”);
}
}
dataset.js(IE8 没有 dataset 属性)
delete elm.dataset[key];
elm.dataset[key] = dataset[key];
改为：
_updateDataset(elm, ‘remove’, key)
_updateDataset(elm, ‘set’, key, dataset[key])
// 兼容 IE8
function _updateDataset(elm, type, key, val) {
if (elm.dataset) {
if (‘remove’ == type) {
delete elm.dataset[key];
} else {
elm.dataset[key] = val;
}
} else {
var name;
name = ‘data-‘ + key;
if (‘remove’ == type) {
elm.removeAttribute(name);
} else {
elm.setAttribute(name, val);
}
}
}
eventlistener.js(这里比较奇怪的就是绑定在 handler 函数上的 vnode 属性在 IE8 上无法访问，所以我在这里采用的是将 vnode 主动传递进去，通过闭包保存)
var listener = vnode.listener = oldVnode.listener || createListener();
改为：
var listener = vnode.listener = oldVnode.listener || createListener(vnode);
function createListener() { // 兼容 IE8，访问不到 handler.vnode, 得传进来
return function handler(event) {
handleEvent(event, handler.vnode);
}
}
改为：
function createListener(vnode) {// 兼容 IE8，访问不到 handler.vnode, 得传进来
return function handler(event) {
if (handler.vnode) {
handleEvent(event, handler.vnode);
} else {
handleEvent(event, vnode);
}
}
}
