Java Web ------ JS基礎(語法2)

1.數字平方

流程:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</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>
	<input type="text" id="num"/>
	<input type="button" value="平方"
		οnclick="pf();"/>
	= <span id="result"></span>
</body>
</html>

圖:

2.猜數字

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script>
	//網頁加載時直接生成隨機數。
	//該數字在body加載前就有了,所以
	//用戶點擊猜時在對應的函數內可以使用
	//0<=x<1 -> <= 100x<100 -> 0,1,..99
	var ran = parseInt(Math.random()*100);
	//無論此函數寫在前面還是在後面,它都是在用戶點擊按鈕
	//時調用,他比生成隨機數執行的晚
	console.log(ran);
	function guess(){
		//獲取文本框的值
		var n = 
			document.getElementById("num").value;
		var span = 
			document.getElementById("result");
		console.log(n);
		//判斷該值是否爲數字
		if(isNaN(n)){
			//不是數字,給予提示
			span.innerHTML = "請輸入數字"
		}else{
			//是數字,和隨機數比較
			if(n<ran){
				span.innerHTML = "小了";
			}else if(n>ran){
				span.innerHTML = "大了";
			}else{
				span.innerHTML = "對了";
			}
			
		}
	}
	
</script>

</head>
<body>
	<input type="text" id="num"/>
	<input type="button" value="猜"
		οnclick="guess();"/>
	<span id="result"></span>
</body>
</html>

圖:

3.數的階乘

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>demo5</title>
<script>
	function jc(){
		//獲得數據
		var n = 
			document.getElementById("num").value;
		var span = 
			document.getElementById("result");
		//判斷是否爲數字
		if(isNaN(n)){
			//不是數字,給予提示
			span.innerHTML("請輸入數字");
		}else{
			 if(n==0){
				 span.innerHTML = 1;
			 }else if(n<0){
				 span.ionnerHTML = "負數沒有階乘";
			 }else{
				 var s = 1;
				 //使用i可以做條件,當i遞減到0時,
				 //就相當於false,循環終止
				 for(var i = n; i; i--){
					 s*=i;
				 }
				 span.innerHTML = s;
			 }	 
		}
	}
</script>
</head>
<body>
	<p>n(正整數)的階乘=1*2*3*..*n</p>
	<p>0的階乘固定爲1</p>
	<p>
		<input type="text" id="num"/>
		<input type="button" value="階乘"
			οnclick="jc();"/>
		= <span id="result"></span>
	</p>
</body>
</html>

圖:

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章