JavaScript计算正方形面积
用JavaScript实现计算正方形的面积注意用一个Math.pow()函数。
实现效果:

实现代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<form method="get" action="">
<h2>计算正方形的面积</h2>
正方形的边长:<input type="text" id="radius"><br>
正方形的面积:<input type="text" readonly="readonly" id="area"><br>
<input type="button" value="计算" onclick="show()" />
<input type="reset" value="重置" />
</form>
</body>
<script type="text/javascript">
function area(radius){
var radius=document.getElementById("radius").value;//获取正方形的边长
var area=Math.pow(radius,2);//计算正方形的面积
return area;
}
function show(){
//输出正方形的面积
document.getElementById("area").value=area(radius);
}
</script>
</html>
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。
相关推荐
-
原生javascript实现DIV拖拽并计算重复面积
复制代码 代码如下: <!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=&qu
-
javascript实现给定半径求出圆的面积
代码相当简单,这里就不多废话了,小伙伴们自己参考下吧. <script> var circularityArea = new Function("r","return r*r*Math.PI"); //创建一个函数对象 var rCircle = 2;//给定圆的半径 var area = circularityArea(rCircle); alert("半径为2的圆面积为:" + area); </script> 以上所
-
JavaScript计算正方形面积
用JavaScript实现计算正方形的面积注意用一个Math.pow()函数. 实现效果: 实现代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <form method="get" a
-
JavaScript计算两个日期时间段内日期的方法
本文实例讲述了JavaScript计算两个日期时间段内日期的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: /************************* * 计算两个日期时间段内所有日期 * * @param value1 * 开始日期 YYYY-MM-DD * @param value2 * 结束日期 * return 日期数组 */ function dataScope(value1, value2
-
javaScript 计算两个日期的天数相差(示例代码)
一:计算两个日期相差的天数 比如: str1 = "2002-01-20" str2 = "2002-10-11" 怎样用javaScript计算出str1与str2之间相差的天数? 复制代码 代码如下: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"&
-
分享javascript计算时间差的示例代码
在实际应用中,需要计算两个时间点之间的差距,一般来说都是计算当前时间和一个指定时间点之间的差距,并且有时候需要精确到天.小时.分钟和秒,下面就简单介绍一下如何实现此效果. 效果图: 距离新年: 代码如下: <html> <head> <title>javascript计算时间差</title> <style type="text/css"> #thenceThen { font-size:2em; } </style&g
-
Javascript计算二维数组重复值示例代码
前言 最近工作中遇到了一个问题,需求是利用Javascript计算二维数组重复值,如下面有个二维数组 [[\'error\',3],[\'error\',5],[\'error\',6],[\'true\',3],[\'true\',1]] 需要统计计算重复项 \'error\' 和 \'true\', 统计计算之后的结果: [[\'error\',14],[\'true\',4]] 实现代码: var arr = [[\'error\',3],[\'error\',5],[\'error\',
-
如何用javascript计算文本框还能输入多少个字符
下面代码超简单,不多说了,直接上代码. //输入计数 //count:能輸入的數據總量 function Calculation(v, count) { var span = $(v).next(); var valLength = $(v).val().length; if (valLength > count) { $(v).val($(v).val().substr(0, count)); valLength = count; } span.text("您已輸入" + va
-
Javascript计算两个marker之间的距离(Google Map V3)
Google Map V3 javascript计算两个marker之间的距离 做地图开发,最常用到的就是marker一些操作和交互.简单介绍一下,两个marker之间的距离计算. google map api 很方便的 只要是常用的 基本上都有接口. 1.创建两个marker点 复制代码 代码如下: var oldMarker = new google.maps.Marker({ position: new google.maps.LatLng("31.95678", "1
-
JavaScript计算某一天是星期几的方法
本文实例讲述了JavaScript计算某一天是星期几的方法.分享给大家供大家参考.具体如下: JavaScript计算某一天是星期几,文本框中是默认值 ,只要按此种格式输入日期时间,就可以推算出当天是星期几,一个简单的JS时间计算实例,运行本效果后,只需点击"计算"按钮即可显示效果,这样我们就能很快的知道某一天是星期几了. 运行效果图如下: <html> <head> <title>计算某一天是星期几</title> <style
-
javascript计算渐变颜色的实例
javascript计算渐变颜色的实例 有时候,一个表格或者一片区域内,需要若干同色系从浅到深的颜色,如图所示: 如果需要的颜色少,则颜色的差异较大,需要的颜色多,则颜色差异小,如下图: 这时,就用到了同色系渐变颜色的计算,算法如下: function getItemColors (colorLevel) { var colors= []; //默认的最深颜色 var red = 134,green = 108, blue = 184; //最浅颜色是239,239,239 比如:最浅颜色的re
-
使用JavaScript计算前一天和后一天的思路详解
要实现在页面上点击"前一天"或"后一天",页面上的时间改变. 首先让我们整理一下思路 如下图: 1.页面排版 首先我们需要拍好页面,例: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body&
随机推荐
- C语言运算符优先级列表(超详细)
- mysql 5.7.17 安装配置方法图文教程(CentOS7)
- 关于nginx+php5.3.8+eclipse3.7工作空间的配置方法
- Oracle ORA-22908(NULL表值的参考)异常分析与解决方法
- 深入解析js轮播插件核心代码的实现过程
- 让多个输入框中的内容同时变化的js代码
- Mysql5.7忘记root密码及mysql5.7修改root密码的方法
- 把文件复制N份的2个Shell脚本代码
- 深入解析Javascript闭包的功能及实现方法
- 初窥JQuery(一)jquery选择符 必备知识点
- 基于JQUERY的多级联动代码
- JavaScript面向对象程序设计教程
- 在Tomcat中部署Web项目的操作方法(必看篇)
- 详解Nginx配置SSL证书实现Https访问
- 常用的php对象类型判断
- TensorFlow高效读取数据的方法示例
- Golang 日期/时间包的使用详解
- laravel 实现根据字段不同值做不同查询
- PHP微信支付功能示例
- python实现Virginia无密钥解密
