《Web交互开发》实验教学指导/实验三: jQuery操作DOM 《Web交互开发》实验教学指导 实验三: jQuery操作DOM 、实验目的(5分) 1、掌握 jQuery开发环境搭建的方法; 2、掌握 jQuery选择符的使用方法 3、掌握DOM元素属性操作的方法 4、掌握DOM元素的添加、删除和复制等操作 二、实验环境(5分) 1、 Windows xp/ Windows7操作系统的计算机; 2、局域网网络环境,并且使用固定IP地址。 三、实验要求(5分) 1、完成表格隔行变色 2、完成导航条的使用 3、完成搜索框的操作 4、完成开心农场的实现; 四、实验原理(5分) l、 jQuery开发环境搭建 2、选择器的使用 3、DOM的操作方法 五、实验步骤(40分) 1、表格隔行变色 (1)表格隔行变色:打开网页后,实现奇数行与偶数行颜色显示不同。具体效果如图3-1 所示 学号 姓名 性别 101张小明男30 李明琪 女 王子夏 男 320 1002 张浩杰 女 图3-1表格隔行变色 本讲共计7页当前第1页《Web 交互开发》实验教学指导 / 实验三 ：jQuery 操作 DOM 本讲共计 7 页 | 当前第 1 页 《Web 交互开发》实验教学指导 实验三：jQuery 操作 DOM 一、实验目的（5 分） 1、掌握 jQuery 开发环境搭建的方法； 2、掌握 jQuery 选择符的使用方法； 3、掌握 DOM 元素属性操作的方法； 4、掌握 DOM 元素的添加、删除和复制等操作； 二、实验环境（5 分） 1、Windows XP/Windows 7 操作系统的计算机； 2、局域网网络环境，并且使用固定 IP 地址。 三、实验要求（5 分） 1、完成表格隔行变色； 2、完成导航条的使用； 3、完成搜索框的操作； 4、完成开心农场的实现； 四、实验原理（5 分） 1、jQuery 开发环境搭建； 2、选择器的使用； 3、DOM 的操作方法； 五、实验步骤（40 分） 1、表格隔行变色 （1）表格隔行变色：打开网页后，实现奇数行与偶数行颜色显示不同。具体效果如图 3-1 所示： 图 3-1 表格隔行变色