zoukankan      html  css  js  c++  java
  • 第六次学习

    1.学习前端的第十二天

    用时:一天
    学习内容:js的基本语法
    学习目标:基本完成
    

    点对应加减乘除按钮的时候,将两个输入框中的数字做对应的算术,并将结果显示在id为result的p标签内。

    <html>
    <head>
        <meta charset="UTF-8">    
        <title>IFE ECMAScript</title>
    </head>
    <body>        
        <input id="first-number" type="number" value="0" placeholder="第一个数字">
        <input id="second-number" type="number" value="0" placeholder="第二个数字">
        <button id="add-btn">加</button>
        <button id="minus-btn">减</button>
        <button id="times-btn">乘</button>
        <button id="divide-btn">除</button>
        <p id="result">运算结果</p>
        <script>
        document.getElementById("add-btn").onclick = function(){
        	var result = parseFloat(document.getElementById("first-number").value) + parseFloat(document.getElementById("second-number").value);
        	document.getElementById("result").innerHTML = result;
        }
        document.getElementById("minus-btn").onclick = function()
        {
        	var result = document.getElementById("first-number").value - document.getElementById("second-number").value;
        	document.getElementById("result").innerHTML = result;
        }
        document.getElementById("times-btn").onclick = function(){
        	var result = document.getElementById("first-number").value * document.getElementById("second-number").value;
        	document.getElementById("result").innerHTML = result;
        }
        document.getElementById("divide-btn").onclick = function()
        {
        	var result = document.getElementById("first-number").value / document.getElementById("second-number").value;
        	document.getElementById("result").innerHTML = result;
        }
        </script>
    </body>
    </html>```
  • 相关阅读:
    一则浏览器兼容性解决案例(搜狗)
    使用sass命令行,包含bourbon,neat包的项目
    指针例1
    数学建模四0-1规划
    数学建模3
    数学建模2.生产计划
    复数的实现1.3
    多文件操作1.2.5
    函数及参数类型1.2.4
    指针类型1.2.3
  • 原文地址:https://www.cnblogs.com/xing--/p/12739240.html
Copyright © 2011-2022 走看看