JavaScript计算正方形面积


Posted in Javascript onNovember 26, 2019

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

实现效果:

JavaScript计算正方形面积

实现代码:

<!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 相关文章推荐
javascript中callee与caller的用法和应用场景
Dec 08 Javascript
利用webqq协议使用python登录qq发消息源码参考
Apr 08 Javascript
jquery索引在使用中的一些困惑
Oct 24 Javascript
JQuery判断HTML元素是否存在的两种解决方法
Dec 26 Javascript
js对图片base64编码字符串进行解码并输出图像示例
Mar 17 Javascript
js的toUpperCase方法用法实例
Jan 27 Javascript
js预加载图片方法汇总
Jun 15 Javascript
Svg.js实例教程及使用手册详解(一)
May 16 Javascript
浅谈vue项目可以从哪些方面进行优化
May 05 Javascript
服务端预渲染之Nuxt(使用篇)
Apr 08 Javascript
解决vue项目运行npm run serve报错的问题
Oct 26 Javascript
vue内置组件keep-alive事件动态缓存实例
Oct 30 Javascript
javaScript中indexOf用法技巧
Nov 26 #Javascript
浅谈Node新版本13.2.0正式支持ES Modules特性
Nov 25 #Javascript
微信小程序实现按字母排列选择城市功能
Nov 25 #Javascript
JS实现点击下拉列表文本框中出现对应的网址,点击跳转按钮实现跳转
Nov 25 #Javascript
jquery使用echarts实现有向图可视化功能示例
Nov 25 #jQuery
如何优雅地在Node应用中进行错误异常处理
Nov 25 #Javascript
jQuery Raty星级评分插件使用方法实例分析
Nov 25 #jQuery
You might like
PHP数组操作――获取数组最后一个值的方法
2015/04/14 PHP
CodeIgniter记录错误日志的方法全面总结
2016/05/17 PHP
5款Javascript颜色选择器
2009/10/25 Javascript
jquery 双色表格实现代码
2009/12/08 Javascript
初试jQuery EasyUI 使用介绍
2010/04/01 Javascript
关于JAVASCRIPT urldecode URL解码的问题
2012/01/08 Javascript
Jvascript学习实践案例(开发常用)
2012/06/25 Javascript
select、radio表单回显功能实现避免使用jquery载入赋值
2013/06/08 Javascript
JS中引用百度地图并将百度地图的logo和信息去掉
2013/09/29 Javascript
js中typeof的用法汇总
2013/12/12 Javascript
Highcharts 多个Y轴动态刷新数据的实现代码
2016/05/28 Javascript
JS提示:Uncaught SyntaxError:Unexpected token ) 错误的解决方法
2016/08/19 Javascript
js实现可旋转的立方体模型
2016/10/16 Javascript
详解从Node.js的child_process模块来学习父子进程之间的通信
2017/03/27 Javascript
Vue实现百度下拉提示搜索功能
2017/06/21 Javascript
微信小程序开发背景图显示功能
2018/08/08 Javascript
使用vue重构资讯页面的实例代码解析
2019/11/26 Javascript
解决vue做详情页跳转的时候使用created方法 数据不会更新问题
2020/07/24 Javascript
[46:40]VGJ.T vs Winstrike 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/20 DOTA
[46:49]完美世界DOTA2联赛PWL S3 access vs Rebirth 第二场 12.19
2020/12/24 DOTA
Python使用scrapy采集时伪装成HTTP/1.1的方法
2015/04/08 Python
Python3里的super()和__class__使用介绍
2015/04/23 Python
python 读取txt,json和hdf5文件的实例
2018/06/05 Python
python语音识别实践之百度语音API
2018/08/30 Python
Python调用C++,通过Pybind11制作Python接口
2018/10/16 Python
在linux下实现 python 监控usb设备信号
2019/07/03 Python
python3.8 微信发送服务器监控报警消息代码实现
2019/11/05 Python
pytorch sampler对数据进行采样的实现
2019/12/31 Python
jenkins+python自动化测试持续集成教程
2020/05/12 Python
使用CSS3 制作一个material-design 风格登录界面实例
2016/12/12 HTML / CSS
html5 迷宫游戏(碰撞检测)实例一
2013/07/25 HTML / CSS
巧克力领导品牌瑞士莲美国官网:Lindt Chocolate美国
2016/08/25 全球购物
学生就业推荐信
2013/11/13 职场文书
2014年护士个人工作总结
2014/11/11 职场文书
司法廉洁教育心得体会
2016/01/20 职场文书
详解CocosCreator项目结构机制
2021/04/14 Javascript