实践能力测试4.docx

实践练习4

注意：本实践练习共包含3个任务，请按要求编写代码并上传到moodle平台-形成性考核模块中对应章节的实践练习中。

任务1——制作QQ简易聊天框

训练要点

?使用html()方法获取和设置页面内容。

?使用val()方法获取聊天内容。

?使用addClass()方法为指定元素追加样式。

?使用数组保存聊天人员的头像和昵称。

?使用随机函数获取聊天人员的头像和昵称。

需求说明

制作如图7.11所示的QQ简易聊天框。

图7.11QQ简易聊天框

（1）在输入框中输入聊天内容，单击“发送”按钮，页面上显示聊天内容，如图7.12和图7.13所示，左侧显示聊天者的头像，右侧显示