利用JS寫一個計算平方的網頁


<!-- 計算一個數的平方並顯示出來 -->

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>計算平方</title>
    <script>
        function pf(){
            var input =    document.getElementById("num");
            console.log(input);    
            //獲取框內的值
            var n = input.value;
            console.log(n);
            //獲取span
            var span = document.getElementById("result");
            //判斷該值是否為數字
            if(isNaN(n)){
                //不是數字,需要重新輸入
                span.innerHTML ="不是數字,請重新輸入數字";
            }else{
                //是數字,計算平方
                span.innerHTML= n*n ;
            }
        }
    
    </script>
</head>
<body>
    <!-- 
    1 如何獲取網頁上的一個元素
        document.getElementById("id")
    2 如何讀寫文本框的值
        讀:input.value
        寫:input.value = "abc"
    3 如何讀寫span的內容 
        讀:span.innerHTML
        寫:span.innerHTML = "abc"
     -->
     
    <input type="text" id ="num"/>
    <input type="button" value="平方" onclick="pf();"/>
    =<span id="result"> </span>
    
</body>
</html>

效果:文本輸入77,點擊平方返回數字

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM