目录

  • 1 HTML(4学时)
    • 1.1 实验目的和要求
    • 1.2 题目1:个性化网站设计
    • 1.3 题目1-9:百度搜索
    • 1.4 题目1-10:百度图库搜索
  • 2 CSS(4学时)
    • 2.1 实验目的和要求
    • 2.2 题目1:小米扫码
    • 2.3 题目2:仿写微信导航栏
    • 2.4 选修:保卫钓鱼岛
    • 2.5 选修:CSS3动画
  • 3 JavaScript(6学时)
    • 3.1 实验目的和要求
    • 3.2 题目1:多彩网页时钟
    • 3.3 题目2:金额转换
    • 3.4 题目3:计算器
    • 3.5 题目4:表单验证
    • 3.6 题目5:动态相册
  • 4 Ajax(4学时)
    • 4.1 实验目的和要求
    • 4.2 题目1:TXT数据请求
    • 4.3 题目2:XML数据请求
    • 4.4 题目3:JSON数据请求
    • 4.5 选做:多级下拉列表
  • 5 jQuery(4学时)
    • 5.1 实验目的和要求
    • 5.2 题目1:实现按钮点击
    • 5.3 题目2:十大名画
    • 5.4 选做:jQuery动画
  • 6 HTML5(2学时)
    • 6.1 实验目的和要求
    • 6.2 题目1:新元素练习
    • 6.3 题目2:绘制五星红旗
    • 6.4 题目3:简易播放器
  • 7 自律思政专题
    • 7.1 法律法规
    • 7.2 行业标准
    • 7.3 道德规范
题目2:十大名画

十大名画

  1. 编写JSON数据

  2. 使用基于jQuery的Ajax进行数据请求

  3. 使用jQuery在页面上进行显示


    1. 数据初始化

      1. 根据JSON数据动态生成表格行

      2. 每行包含十大名画信息,并增加编辑、删除、保存(默认不显示)、取消(默认不显示)按钮

      3. 所有输入框默认不可编辑

      4. 在最后一行添加“增加”按钮

    2. 增加新行

      1. 点击“增加”按钮添加一行空行

      2. 增加保存、取消按钮

    3. 取消操作

      1. 点击取消给出警告框

      2. 如果确认,重新加载数据

      3. 如果取消,返回继续编辑

    4. 保存信息

      1. 如果信息不完整,警告

      2. 信息完整,则将输入信息加入十大名画数组中

    5. 编辑操作

      1. 点击某一行的编辑按钮,则隐藏其他行所有操作按钮

      2. 当前行按钮修改为“保存”、“取消”

    6. 删除操作

      1. 点击某一行删除,给出警告框

      2. 如果确认,删除当前行数据,并从新加载数据

      3. 如果取消,直接返回