任务目的

• 学习与实践JavaScript的基本语法、语言特性
• 练习使用JavaScript实现拖拽功能

任务描述

• 基于上个任务，将任务的代码进行抽象、封装，然后在此基础上实现如图中的两个需求：Tag输入和兴趣爱好输入
• 实现一个tag输入框
• 要求遇到用户输入空格，逗号，回车时，都自动把当前输入的内容作为一个tag放在输入框下面。
• Tag不能有重复的，遇到重复输入的Tag，自动忽视。
• 每个Tag请做trim处理
• 最多允许10个Tag，多于10个时，按照录入的先后顺序，把最前面的删掉
• 当鼠标悬停在tag上时，tag前增加删除二字，点击tag可删除
  阅读全文 »

任务目的

• 实践JavaScript数组、字符串相关操作

任务描述

• 基于 Task05 进行升级
• 将新元素输入框从input改为textarea
• 允许一次批量输入多个内容，格式可以为数字、中文、英文等，可以通过用回车，逗号（全角半角均可），顿号，空格（全角半角、Tab等均可）等符号作为不同内容的间隔
• 增加一个查询文本输入框，和一个查询按钮，当点击查询时，将查询词在各个元素内容中做模糊匹配，将匹配到的内容进行特殊标识，如文字颜色等。举例，内容中有abcd，查询词为ab或bc，则该内容需要标识
  阅读全文 »

任务目的

• 学习与实践 JavaScript 的基本语法、语言特性
• 初步了解 JavaScript 的事件是什么
• 初步了解 JavaScript 中的DOM是什么
• 学习与实践 JavaScript 的基本语法、语言特性
• 练习使用 JavaScript 实现简单的排序算法

任务描述

05

• 模拟一个队列,队列的每个元素是一个数字，初始队列为空
• 有一个input输入框，以及4个操作按钮
• 点击”左侧入”,将input中输入的数字从左侧插入队列中；
• 点击”右侧入”,将input中输入的数字从右侧插入队列中；
• 点击”左侧出”,读取并删除队列左侧第一个元素，并弹窗显示元素中数值；
• 点击”右侧出”,读取并删除队列又侧第一个元素，并弹窗显示元素中数值；
• 点击队列中任何一个元素,则该元素会被从队列中删除
  阅读全文 »

任务目的

• 在上一任务基础上继续JavaScript的体验
• 接触更加复杂的表单对象
• 实现页面上的一个完整交互功能
• 用DOM实现一个柱状图图表

去看瓷器古董的时候，如果卖家直接把瓷器递给买家，容易失手掉下去，也不好判定到底是谁的责任。于是有了这样一条规矩：卖家会把瓷器放在桌子上，离手之后，买家再去拿。这样既保证了瓷器在传递过程中的安全性，也容易分辨是谁失手打碎的瓷器。

Web客户端和服务器

上面这条规矩规定了贵重瓷器是如何在买家与卖家之间传递而不被破坏的。大家都知道Web内容都是存在Web服务器上的。那么Web客户端(最常见的是浏览器)与服务器之间的信息什么时候传递、如何传递、具体传递什么，并且能够保证数据在传输过程中不会被损坏或产生混乱？于是就有了HTTP。

HTTP是超文本传输协议的英文缩写。既然要保证传输过程中数据不被损坏，说明HTTP是一种可靠的数据传输协议。当我们想浏览某个页面时，浏览器会向服务器发送一个HTTP请求。服务器会寻找所期望的对象，如果存在，就将对象、对象类型。对象长度以及其他的一些信息放在HTTP响应中发送给客户端。

下图可能会更加直观：