《Web交互开发》实验教学指导/实验三: JavaScript高级应用 《Web交互开发》实验教学指导 实验三: JavaScript高级应用 、实验目的(5分) 1、掌握 JavaScript编程思路 2、掌握DOM的编程方法; 3、掌握 Window的编程方法 4、掌握 JavaScript事件的使用; 二、实验环境(5分) 1、 Windows xp/ Windows7操作系统的计算机 2、局域网网络环境,并且使用固定IP地址。 三、实验要求(5分) 1、完成网页中节点的插入 2、完成定时器的开发 3、完成注册页面的编写 4、完成进度条的编写 四、实验原理(5分) 1、DOM编程方法 2、 Window编程方法; 3、 JavaScript事件的使用 五、实验步骤(40分) 1、在网页中插入节点 (1)对于DOM的操作有很多,包括在网页中创建节点、插入节点、复制节点、删除节点等, 本例中完成网页节点的创建和插入。 (2)创建节点程序代码如sy3-1所示 <body onload="create Child"> var hl=document. create Element(h1"); var txt=document. createTextNode "Hello, World") hI. append Child(txt) document body. appendChild(h1); <body> 本讲共计3页|当前第1页《Web 交互开发》实验教学指导 / 实验三:JavaScript 高级应用 本讲共计 3 页 | 当前第 1 页 《Web 交互开发》实验教学指导 实验三:JavaScript 高级应用 一、实验目的(5 分) 1、掌握 JavaScript 编程思路; 2、掌握 DOM 的编程方法; 3、掌握 Window 的编程方法; 4、掌握 JavaScript 事件的使用; 二、实验环境(5 分) 1、Windows XP/Windows 7 操作系统的计算机; 2、局域网网络环境,并且使用固定 IP 地址。 三、实验要求(5 分) 1、完成网页中节点的插入; 2、完成定时器的开发; 3、完成注册页面的编写; 4、完成进度条的编写。 四、实验原理(5 分) 1、DOM 编程方法; 2、Window 编程方法; 3、JavaScript 事件的使用。 五、实验步骤(40 分) 1、在网页中插入节点 (1)对于 DOM 的操作有很多,包括在网页中创建节点、插入节点、复制节点、删除节点等, 本例中完成网页节点的创建和插入。 (2)创建节点程序代码如 sy3-1 所示。 <body onload="createChild()"> <script> function createChild(){ var h1=document.createElement("h1"); var txt=document.createTextNode("Hello,World"); h1.appendChild(txt); document.body.appendChild(h1); } </script> </body>