5.3.5 实验步骤

5.3.5 实验步骤

任务1实验分解

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

(2) 在项目窗口TableAlternates上,右键选择“新建html文件”,输入文件名称“index”,点击创建按钮。

(3) 在新建文件下,写入如下基础代码。

效果如图5.10所示。

图5.10

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

图5.11

(5) 在页面的<head>标签里面加上jQuery的引入代码。

(6) 添加一个加载函数。

代码如下:

(9) 分别为奇数行和偶数行添加样式,表格的奇数行添加奇数行的样式,表格的偶数行添加偶数行的样式,最终效果如图5.12所示。

图5.12

新加代码:

至此完成任务1所有要求。