「 百度前端技术学院 」-任务提交仓库
这里是参加2016年度春季班时的代码仓库。
百度Web前端技术学院（Baidu Institute of Front-End Technology简称IFE）是一个由百度人力资源部校园招聘组、百度EFE团队联合出品的、面向在校大学生以及对前端技术有兴趣的前端在线学习平台，我们希望能够借助百度大量优秀的前端工程师以及丰富的前端知识积累，帮助人们更加有趣、高效、系统地学习Web前端技术。
任务8：Demo
- 网格布局的作用在于更有效地控制元素在网页中所占比例的大小。 比如，博客中有一个留言板模块，在比较大的屏幕上，我们希望它占了右边 25% 的宽度，在手机等比较小的屏幕上，我们希望它占 100% 的宽度，出现在博客文章下方。 网格布局是一种实现这一需求的办法，它的好处是，把所有的宽度分为固定栏数（常用 12 栏），从而更高效的控制元素宽度。而这功能，我们使用 HTML 和 CSS 就能实现了。
任务10：Demo
- 屏幕宽度小于 640px 时，调整 Flexbox 的属性以实现第四个元素移动到最前面的效果，而不要改动第一个元素的边框颜色与高度实现效果图。 思考 Flexbox 布局和网格布局的异同，以及分别适用于什么样的场景。可以搜索一下别人的结论，不过要保持思辨的态度，不可直接接受别人的观点。
任务18：Demo
- 模拟一个队列，队列的每个元素是一个数字，初始队列为空 有一个input输入框，以及4个操作按钮 点击"左侧入"，将input中输入的数字从左侧插入队列中 点击"右侧入"，将input中输入的数字从右侧插入队列中 点击"左侧出"，读取并删除队列左侧第一个元素，并弹窗显示元素中数值 点击"右侧出"，读取并删除队列又侧第一个元素，并弹窗显示元素中数值 点击队列中任何一个元素，则该元素会被从队列中删除
任务19：Demo
- 基于任务18 限制输入的数字在10-100 队列元素数量最多限制为60个，当超过60个时，添加元素时alert出提示 队列展现方式变化，直接用高度表示数字大小 实现一个简单的排序功能，如冒泡排序（不限制具体算法），用可视化的方法表达出来
任务20：Demo
- 基于任务18进行升级 将新元素输入框从input改为textarea 允许一次批量输入多个内容，格式可以为数字、中文、英文等，可以通过用回车，逗号（全角半角均可），顿号，空格（全角半角、Tab等均可）等符号作为不同内容的间隔 增加一个查询文本输入框，和一个查询按钮，当点击查询时，将查询词在各个元素内容中做模糊匹配，将匹配到的内容进行特殊标识，如文字颜色等。 举例，内容中有abcd，查询词为ab或bc，则该内容需要标识
任务22：Demo
- 在页面中展现一颗二叉树的结构 提供一个按钮，显示开始遍历，点击后，以动画的形式呈现遍历的过程 二叉树的遍历算法和方式自定，前序中序后序皆可，但推荐可以提供多种算法的展示（增加多个按钮，每个按钮对应不同的算法） 当前被遍历到的节点做一个特殊显示（比如不同的颜色） 每隔一段时间（500ms，1s等时间自定）再遍历下一个节点
任务23：Demo
- 基于任务22，将二叉树变成了多叉树，并且每一个节点中带有内容 提供一个按钮，显示开始遍历，点击后，以动画的形式呈现遍历的过程 当前被遍历到的节点做一个特殊显示（比如不同的颜色） 每隔一段时间（500ms，1s等时间自定）再遍历下一个节点 增加一个输入框及一个“查询”按钮，点击按钮时，开始在树中以动画形式查找节点内容和输入框中内容一致的节点，找到后以特殊样式显示该节点，找不到的话给出找不到的提示。 查询过程中的展示过程和遍历过程保持一致