6.4.5　实验步骤

6.4.5　实验步骤

任务1实验分解

（1） 打开HBuilderX 进入开发界面，选择“文件新建项目”菜单，进入新建项目界面。选择普通项目，输入项目名称“UserLogin”，并选择默认项目，点击创建按钮。

（2） 在项目窗口UserLogin上，右键选择“新建html文件”，输入文件名称“index”，点击创建按钮。

（6） 在实验资料与素材中找到文件，选中全部复制，并粘贴到项目中，如图6.14所示。

图6.14

（3） 在新建文件下，写入如下基础代码。

效果如图6.15所示。

图6.15

（4） 在实验资料与素材中找到jquery-3.4.1.js文件，选中文件复制，并粘贴到项目中，如图6.16所示。

图6.16

（5） 在页面的＜head＞标签里面加上jquery的引入代码。

（6） 添加一个加载函数。

代码如下：

（7） 模仿实现一个登录功能，当输入用户名和密码后点击登录按钮，将用户名和密码与文件夹中的json文件的数据对比，如果账户密码全部匹配证明登录成功，最终效果如图6.17和图6.18所示。

图6.17

图6.18

新加代码：

至此完成任务1所有要求