"使用JavaScript计算圆面积的实验报告"
50 浏览量
更新于2024-04-02
收藏 1018KB DOC 举报
Java Web Development Technology Experiment Report
Experiment 1: HTML Javascript
In this experiment, we created a web page called circle.htm where users can input the radius of a circle using the input component. We then wrote a javascript function called area to calculate the area of the circle based on the input radius. Finally, we used an alert dialog box to output the calculated area to the user.
The HTML code used for this experiment is as follows:
```
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Area 函数计算圆的面积</title>
<script type="text/javascript">
function Area()
{
var Oradius=document.getElementById('txt');
var r=Oradius.value;
var s=r*r*3.14;
alert("圆的面积为:" + s);
}
</script>
</head>
<body>
输入圆的半径:<input type="text" id="txt" />
<input type="button" onClick="Area()" value="计算面积" />
</body>
</html>
```
This experiment served as a practice in using HTML and Javascript to create interactive web pages. By allowing users to input the radius and calculating the area of the circle dynamically, we demonstrated the power of combining these technologies for web development.
Overall, this experiment was a valuable learning experience in the fundamentals of web development using Java technologies. It provided us with hands-on practice in creating dynamic web pages and interacting with users through input components and javascript functions.
2023-03-10 上传
Java Web实验报告 Java Web Experiment Report 学生所在学院: 学院 学生所在班级: 学 生 姓 名 : 学 号 : 指 导 教 师 : 月 一、客户端开发设计:系统设计 一、实验目的 掌握Html的语法和用法,能制作简单的网页 二、实验原理 通过学习Html相关知识,了解各个标签的使用方法,设计出自己的网站页面。 三、实验内容 网页部分代码:index.jsp <html> <head> <title>用户管理系统</title> </head> <body>
用户登陆
注册新用户 </body> </html> 网页截图: 二、基础语法:用户登录实现 一、实验目的 掌握javascript的语法,能验证表单,实现用户登录。 二、实验原理 通过学习javascript的相关知识,了解javascript的语法,了解javascript的特性, 了解javascript的常用方法,掌握验证表单的方法,实现用户登录。 三、实验内容 网页代码:login.jsp <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>注册</title> <script language="javascript"> function check(){ var userid = new String(document.forms[0].userid.value); var password = new String(document.forms[0].password.value); if(userid==""){ alert("请输入账号!") return false; } if(userid.length>20){ alert("账号太长,不能大于20个字符"); return false; } if(password.length<6){ alert("密码太短,必须大于6个字符"); return false; } return true } </script> </head> <body>
</form> </body> </html> 网页截图: 以下是输入正确的登陆截图。 三、程序设计:插入功能设计 一、实验目的 掌握jsp的语法,懂得将Java代码放入页面,实现更多功能。 掌握jdbc的使用,并连接数据库,实现新增用户功能。 二、实验原理 通常在jsp页面收集数据,然后传回服务器处理。服务器连接数据库,将数据存回数 据库中。 三、实验内容 页面代码:register.jsp <html> <head> <base href="<%=basePath%>"> <title>欢迎注册</title> </head> <body> <form action="register.jsp" method="post">
用户管理
账号 | 密码 | 昵称 | 操作 |
用户登陆
注册新用户
用户登陆
<form action="" method="post" onSubmit="return check()" >账号:<input type="text" name="userid" id="userid" /> |
密码:<input type="password" name="password" id="password" /> |
<input type="submit" name="submit" value="登陆" /> <input type="reset" value="重置" /> |
用户注册
账号:<input type="text" name="userid"> |
密码:<input type="password" name="password"> |
昵称:<input type="text" name=" 2022-06-16 上传 2022-06-10 上传 2022-11-30 上传 2022-06-09 上传 2021-09-19 上传 2022-06-14 上传 2022-06-27 上传 Mmnnnbb123
最新资源
|