Javascript 切换材质设计图标

$.fn.extend({
树型：函数（o）{
var openedClass='glyphicon减号'；
var closedClass='glyphicon加号'；
var openedIconClass='keyboard_arrow_down'；
var closedIconClass='keyboard_arrow_up'；
如果（类型o！=“未定义”）{
if（o.openedClass的类型！=“未定义”）{
openedClass=o.openedClass；
}
if（o.closedClass的类型！=“未定义”）{
closedClass=o.closedClass；
}
};
//初始化每个顶层
var-tree=$（这个）；
addClass（“树”）；
tree.find（'li'）。有（'ul'）。每个（函数（）{
$（'.material icons'）.css（'display'，'block'）；
var branch=$（this）；//li与子对象ul
分支。预结束（“”）；
branch.addClass（“branch”）；
“点击”功能（e）上的分支{
$（'.material icons'）。切换类（“显示块”）；
$（此）.toggleClass（“橙色灯光”）；
if（$（this）.hasClass（“橙色灯光”））{
$（“.arrow”，this）.text（'键盘箭头向上'）；
}
if（this==e.target）{
var icon=$（this.children（'i:first'）；
console.log（icon.text）；
icon.toggleClass（openedClass+“”+closedClass）；
icon.toggleClass（openedIconClass+“”+closedIconClass）；
$（this.children（）.children（）.toggle（）；
}
})
branch.children（）.children（）.toggle（）；
});
//从动态添加的图标触发事件
tree.find（'.branch.indicator'）。每个（函数（）{
$（此）.on（'click'，函数（）{
$（this）.最近（'li'）。单击（）；
});
});
//如果li包含锚定而不是文本，则触发事件以打开分支
tree.find（'.branch>a'）。每个（函数（）{
$（此）.on（'click'，函数（e）{
$（this）.最近（'li'）。单击（）；
e、 预防默认值（）；
});
});
//如果li包含按钮而不是文本，则触发事件以打开分支
tree.find（'.branch>button'）。每个（函数（）{
$（此）.on（'click'，函数（e）{
$（this）.最近（'li'）。单击（）；
e、 预防默认值（）；
});
});
}
});
//treeviews的初始化
$（'#tree1'）.treed（）；
$（'#tree2'）.treed（{openedClass:'glyphicon-folder-open'，closedClass:'glyphicon-folder-close'}）；
$（'#tree3'）.treed（{openedClass:'glyphicon-chevron-right'，closedClass:'glyphicon-chevron-down'}）

.tree，.tree.ul{
保证金：0；
填充：0；
列表样式：无
}
树胶{
左边距：1米；
职位：相对
}
树胶{
左边距：.5em
}
树：以前{
内容：“；
显示：块；
宽度：0；
位置：绝对位置；
顶部：18px；
底部：16px；
左：40px；
左边框：1px实心；
边框颜色：#556f7b；
}
李先生{
保证金：0；
填充：0.1em；
线高：2米；
位置：相对位置；
字体系列：Roboto；
字体大小：14px；
字号：500；
字体风格：普通；
字体拉伸：正常；
字母间距：正常；
文本对齐：左对齐；
颜色：#000000；
}
李：以前{
内容：“；
显示：块；
宽度：10px；
身高：0；
边框顶部：1px实心；
页边顶部：-1px；
位置：绝对位置；
顶部：32px；
左：40px；
边框颜色：#556f7b；
}
最后一个孩子：以前{
背景：#fff；
高度：自动；
顶部：32px；
底部：0
}
.指标{
右边距：5px；
}
李树先生{
文字装饰：无；
字体系列：Roboto；
字体大小：14px；
字号：500；
字体风格：普通；
字体拉伸：正常；
字母间距：正常；
文本对齐：左对齐；
颜色：#000000；
}
.tree li按钮、.tree li按钮：活动、.tree li按钮：焦点{
文字装饰：无；
颜色：#369；
边界：无；
背景：透明；
保证金：0px 0px 0px 0px；
填充：0px 0px 0px 0px；
大纲：0；
}
.分行{
高度：64px；
边界半径：2px；
盒影：0x2px0rgba（0,0,0,0.12），0px2px2px0rgba（0,0,0,0.15）；
边框：实心1px透明；
填充顶部：18px！重要；
光标：指针；
}
.指标{
颜色：透明；
左边距：5px；
右边距：5px；
}
.一级{
左侧填充：40px；
边缘底部：6px；
}
.橙色灯光{
背景#fff4e7；
}
.显示块{
显示：块！重要；
}


法夫

报告

报告1
报告2
报告3




afasf

报告

报告1
报告2
报告3





<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">

<i id="toggleId" class="material-icons" onclick="toggleMaker()">keyboard_arrow_down</i>

<script>
  function toggleMaker() {
    var toggleElement = document.getElementById("toggleId")
    if(toggleElement.innerHTML === "keyboard_arrow_down") {
      toggleElement.innerHTML = "keyboard_arrow_up";
    }
    else {
      toggleElement.innerHTML = "keyboard_arrow_down";
    }
  }
</script>