JavaScript交互式网页设计作业目录(作业笔记)

第1章 JavaScript基本语法  >>>

1.1.4 使用 JavaScript 的 HTML 页面混合、JavaScript 文件引用和 HTML 代码嵌入 3 种方式在 HTML 页面上打印出“点击我进入到百度首页”的超链接

1.2.5 使用 JavaScript 中的变量、数据类型和运算符,计算出两个 number 类型的变量与一个 string 类型的变量的和,根据 string 类型处于运算符的不同位置得到不同的结果

1.3.3 使用 JavaScript 根据消费金额和消费者是否为会员确定折扣,最终核算实际应该支付的金额

1.4.5 使用 JavaScript 用循环嵌套输出乘法表。外循环控制行数,内循环控制当前行要输出的乘法表达式,在页面上输出九九乘法表

第2章 JavaScript函数与事件  >>>

2.1.7 使用 JavaScript自定义函数计算出教室的体积大小,其中教室的长、宽、高分别为 8 米、5 米、3 米

2.2.5 在文本框中输入两个操作数和选择运算符后,在页面上显示输出结果

2.3.3 根据在下拉列表框中选择的内容,决定页面效果 用户在下拉列表框中选择页面将要使用的背景颜色 当用户选择橙色时,页面背景将显示为橙色

2.4.4 制作登录页面 点击键盘的 Enter 键或者单击“登录”按钮,验证用户输入的邮箱和密码是否正确

第3章 JavaScript浏览器对象模型  >>>

3.2.5 使用 JavaScript 中的 window 对象执行计时操作,完成一个抽奖程序

3.3.3 使用 history 对象和 location 对象中的属性和方法制作一个简易的网页浏览工具

3.4.3 使用 JavaScript 根据用户浏览页面的设备和屏幕的分辨率,在页面上显示不同的页面和不同大小的图

第4章 JavaScript文档对象模型  >>>

4.1.3 使用 JavaScript 中的 document 对象的属性,根据下拉框中选择的属性,更改页面中的字体颜色和背景颜色

4.2.5 使用 JavaScript 中的 document 对象查找 HTML 元素,实现“登录”按钮的高亮特效 鼠标悬浮于“登录”按钮时,按钮高亮显示;

4.3.5 制作四个选项卡页 Tab,用户可以通过切换不同的 Tab 页查看不同类别的新闻信息,每个 Tab 有对应的内容版块,点击某个选项卡时,显示对应的内容版块,隐藏其他内容版块,并且为了突出当前的选项卡,还可以设置其背景样式

4.4.3 在页面上绘制一张表格,使用 DOM 节点的动态添加和删除向表格中插入数据,点击表格每行后的“删除”超链接

第5章 JavaScript对象  >>>

5.1.4 使用 JavaScript 中的 Date 对象,在页面上显示一个万年历。选择不同的年份和月份,在页面中显示当前月的日历

5.2.3 使用JavaScript 中的Math对象和勾股定理公式,计算鼠标的位置与页面图片中心点的距离,根据距离对页面上的图片进行放大或缩小处理。距离远时图片放大,距离近时图片缩小

5.3.3 使用JavaScript数组实现省份和城市的级联菜单

5.4.3 使用自定义对象动态在页面上绘制一张表格,动态地向表格中添加公司员工的基本信息,测试数据不少于3 条,员工信息包括姓名、年龄、性别和部门

第6章 初识jQuery  >>>

6.1.6 使用 jQuery 实现页面背景色的更换,通过下拉框选择对应的颜色,页面背景会随着选中的颜色进行更换

6.2.3 使用 jQuery 基本选择器获取页面元素,然后利用 jQuery 对象的 css() 方法动态设置 和 标签的样式

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>慕课网</title> <link href="css/style.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="js/js/myfocus-2.0.1.min.js"></script> <script type="text/javascript"> myFocus.set({ id:'demo', pattern:'mF_liquid'}); </script> </head> <body> <div id="top"> <div id="top_text"> <ul> <li><a href="#">联系我们</a></li> <li><a href="#">加入收藏</a></li> <li><a href="#">设为首页</a></li> </ul> </div> </div> <div id="middle"> <div id="logo"> <div id="logo_left"> <img src="images/logo.jpg" alt="" width="200" height="80" /> </div> <div id="logo_right"> <img src="images/tel.jpg" width="28" height="28" /> 24小时服务热线 <span>123-456-7890</span> </div> <br class="clear_float"> </div> <div id="nav"> <div id="nav_left"> <img src="images/nav_left.jpg" width="10" height="40" /> </div> <div id="nav_middle"> <ul> <li><a href="#">首页</a></li> <li><a href="#">关于幕课</a></li> <li><a href="#">新闻动态</a></li> <li><a href="#">课程中心</a></li> <li><a href="#">在线课程</a></li> <li><a href="#">人才招聘</a></li> </ul> <div id="gezi"> <form> <input type="text" /> </form> </div> </div> <div id="nav_right"> <img src="images/nav_right.jpg" width="10" height="40" /> </div> </div> <div id="demo" class="ad"> <div class="pic"> <ul> <li><a href="#"><img src="images/ad2.jpg" thumb="" alt="" text="详细描述2" /></a></li> <li><a href="#"><img src="images/ad3.jpg" thumb="" alt="" text="详细描述3" /></a></li> <li><a href="#"><img src="images/ad4.jpg" thumb="" alt="" text="详细描述4" /></a></li> <li><a href="#"><img src="images/ad3.jpg" thumb="" alt="" text="详细描述5" /></a></li> </ul> </div> </div>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值