重新整理了任务 ##任务13：本任务完成的功能为：用户可以在输入框中输入任何内容，点击“确认填写”按钮后，用户输入的内容会显示在“您输入的值是”文字的右边 ##任务14：学习JavaScript中的if判断语法，for循环语法，学习JavaScript中的数组对象，学习如何读取、处理数据，并动态创建、修改DOM中的内容 ##页面加载后，将提供的空气质量数据数组，按照某种逻辑（比如空气质量大于60）进行过滤筛选，最后将符合条件的数据按照一定的格式要求显示在网页上 ##任务15：接触一下JavaScript中的高级选择器，学习JavaScript中的数组对象遍历、读写、排序等操作，学习简单的字符串处理操作，读取页面上已有的source列表，从中提取出城市以及对应的空气质量 将数据按照某种顺序排序后，在resort列表中按照顺序显示出来 ##任务16：深入学习JavaScript的事件机制及DOM操作，学习事件代理机制，学习简单的表单验证功能，学习外部加载JavaScript文件 ##用户输入城市名称和空气质量指数后，点击“确认添加”按钮后，就会将用户的输入在进行验证后，添加到下面的表格中，新增一行进行显示 用户输入的城市名必须为中英文字符，空气质量指数必须为整数 用户输入的城市名字和空气质量指数需要进行前后去空格及空字符处理（trim） 用户输入不合规格时，需要给出提示（允许用alert，也可以自行定义提示方式） 用户可以点击表格列中的“删除”按钮，删掉那一行的数据 ##任务17：接触更加复杂的表单对象，实现页面上的一个完整交互功能，用DOM实现一个柱状图图表，原始数据包含几个城市的空气质量指数数据 用户可以选择查看不同的时间粒度，以选择要查看的空气质量指数是以天为粒度还是以周或月为粒度 天：显示每天的空气质量指数 周：以自然周（周一到周日）为粒度，统计一周7天的平均数为这一周的空气质量数值，如果数据中缺少一个自然周的几天，则按剩余天进行计算 月：以自然月为粒度，统一一个月所有天的平均数为这一个月的空气质量数值 用户可以通过select切换城市 通过在"aqi-chart-wrap"里添加DOM，来模拟一个柱状图图表，横轴是时间，纵轴是空气质量指数，参考图（点击打开）。天、周、月的数据只根据用户的选择显示一种。 ##任务18：模拟一个队列，队列的每个元素是一个数字，初始队列为空，有一个input输入框，以及4个操作按钮 点击"左侧入"，将input中输入的数字从左侧插入队列中； 点击"右侧入"，将input中输入的数字从右侧插入队列中； 点击"左侧出"，读取并删除队列左侧第一个元素，并弹窗显示元素中数值； 点击"右侧出"，读取并删除队列又侧第一个元素，并弹窗显示元素中数值； 点击队列中任何一个元素，则该元素会被从队列中删除 ##任务19：练习使用JavaScript实现简单的排序算法，基于任务18 限制输入的数字在10-100 队列元素数量最多限制为60个，当超过60个时，添加元素时alert出提示 队列展现方式变化如图，直接用高度表示数字大小 实现一个简单的排序功能，如冒泡排序（不限制具体算法），用可视化的方法表达出来 ##任务20：实践JavaScript数组、字符串相关操作，基于任务18进行升级 将新元素输入框从input改为textarea 允许一次批量输入多个内容，格式可以为数字、中文、英文等，可以通过用回车，逗号（全角半角均可），顿号，空格（全角半角、Tab等均可）等符号作为不同内容的间隔 增加一个查询文本输入框，和一个查询按钮，当点击查询时，将查询词在各个元素内容中做模糊匹配，将匹配到的内容进行特殊标识，如文字颜色等。举例，内容中有abcd，查询词为ab或bc，则该内容需要标识 ##任务21：学习与实践JavaScript的基本语法、语言特性 练习使用JavaScript实现拖拽功能 ##任务22：学习树这种数据结构的基本知识，在页面中展现一颗二叉树的结构，并对进行可视化遍历 提供一个按钮，显示开始遍历，点击后，以动画的形式呈现遍历的过程 二叉树的遍历算法和方式自定，前序中序后序皆可，但推荐可以提供多种算法的展示（增加多个按钮，每个按钮对应不同的算法） 当前被遍历到的节点做一个特殊显示（比如不同的颜色） 每隔一段时间（500ms，1s等时间自定）再遍历下一个节点 ##任务23：将二叉树变成了多叉树，并且每一个节点中带有内容，对其进行比遍历，并能够进行搜索 提供一个按钮，显示开始遍历，点击后，以动画的形式呈现遍历的过程 当前被遍历到的节点做一个特殊显示（比如不同的颜色） 每隔一段时间（500ms，1s等时间自定）再遍历下一个节点 增加一个输入框及一个“查询”按钮，点击按钮时，开始在树中以动画形式查找节点内容和输入框中内容一致的节点，找到后以特殊样式显示该节点，找不到的话给出找不到的提示。查询过程中的展示过程和遍历过程保持一致 ##任务24：基于任务23，添加节点的选择、增加与删除的功能 点击某个节点元素，则该节点元素呈现一个特殊被选中的样式 增加一个删除按钮，当选中某个节点元素后，点击删除按钮，则将该节点及其所有子节点删除掉 增加一个输入框及一个“添加”按钮当选中某个节点元素后，点击增加按钮，则在该节点下增加一个子节点，节点内容为输入框中内容，插入在其子节点的最后一个位置 ##任务25：基于任务24的基本代码，实现一个树形组件，可参考如图示例，样式自定义，不做限制 要求有以下功能： 节点的折叠与展开 允许增加节点与删除节点 按照内容进行节点查找，并且把找到的节点进行特殊样式呈现，如果找到的节点处于被父节点折叠隐藏的状态，则需要做对应的展开