物聯網行動商務實務: javascript介紹

2016年12月28日星期三

javascript介紹

https://www.tutorialspoint.com/index.htm
運算子&& || !
&& 積法功能
|| 加法功能
!反相

document.getElementById("sp1").innerHTML="";
if

switch

<script language="javascript">
function fun1()
{
document.getElementById("sp1").innerHTML="";
var choose=parseInt(prompt("輸入1-4整數："));
switch (choose)
{
case 1:
{
document.getElementById("sp1").innerHTML="牡丹花";
break;
}
case 2:
{
document.getElementById("sp1").innerHTML="荷花";
break;
}
case 3:
{
document.getElementById("sp1").innerHTML="楓葉";
break;
}
case 4:
{
document.getElementById("sp1").innerHTML="梅花";
break;
}
default:
{
document.getElementById("sp1").innerHTML="選擇錯誤";
}
}

}
</script>

<body>
請輸入(1)春天(2)夏天(3)秋天(4)冬天
<a href="javascript:void();" onclick="fun1()">執行</a>
<p>
<span id="sp1"></span>
</body>
==================================================
For Loop

For Loop

<script language="javascript">
function fun1()
{
document.getElementById("sp1").innerHTML="";
var total=0;

for (var i=1;i<=100;i++)
{
total=total+i;
}
document.getElementById("sp1").innerHTML=total;
}
</script>

<body>

<a href="javascript:void();" onclick="fun1()">執行</a>
<p>
<div id="sp1"></div>
=================================================
<script language="javascript">
function fun1()
{
document.getElementById("sp1").innerHTML="";
var k="";

for (var i=10;i>=1;i--)
{
k=k+String(i)+"    ";
}
document.getElementById("sp1").innerHTML=k;
}
</script>

<body>

<a href="javascript:void();" onclick="fun1()">執行</a>
<p>
<span id="sp1"></span>
</body>
---------------------------------------------------------------------
break;
continue;
while()
{
[ ]
}
do
[[]]while();
ex
document.getElementById("sp1").innerHTML="";
var i=1; //初始值
var sum=0;
while(i<=100) 判斷式
{
sum=sum+i;
i=i+2; 增量值
}
document.getElementById("sp1").innerHTML=sum;
========================================================

</style>
<script language="javascript">
function fun1() {
var id,na="";
var v3,v4,v5,v6,sm,ag=0;
id=document.getElementById("t1").value;
na=document.getElementById("t2").value;
v3=parseInt(document.getElementById("t3").value);
v4=parseInt(document.getElementById("t4").value);
v5=parseInt(document.getElementById("t5").value);
v6=parseInt(document.getElementById("t6").value);
sm=v3+v4+v5+v6;
ag=sm/4;
document.getElementById("sum").value=sm;
document.getElementById("avg").value=ag;
var str=document.getElementById("te1").value;
str=str+id+"\t"+na+"\t"+String(v3)+"\t"+String(v4)+"\t";
str=str+String(v5)+"\t"+String(v6)+"\t";
str=str+String(sm)+"\t"+String(ag)+"\n";
document.getElementById("te1").value=str;
}
function fun2() {
document.getElementById("t1").value="";
document.getElementById("t2").value="";
document.getElementById("t3").value="";
document.getElementById("t4").value="";
document.getElementById("t5").value="";
document.getElementById("t6").value="";
document.getElementById("sum").value="";
document.getElementById("avg").value="";
}
</script>
</head>

<body style="font-size:18px;font-weight:bold;">
<table border="1" align="center" width="650" style="background-color:#FCF;">
<tr><td align="center" colspan="4" style="font-size:24px; font-weight:bold; color:brown;">
<b><i><u>學生成績計算</u></i></b>
</td></tr>
<tr>
<td width="10%">學號：</td>
<td width="40%" align="center"><input type="text" id="t1" name="t1" size="20" /></td>
<td width="10%">姓名：</td>
<td width="40%" align="center"><input type="text" id="t2" name="t2" size="20" /></td>
</tr>
<tr>
<td>國文：</td>
<td align="center"><input type="text" id="t3" name="t3" size="20" /></td>
<td>英文：</td>
<td align="center"><input type="text" id="t4" name="t4" size="20" /></td>
</tr>
<tr>
<td>數學：</td>
<td align="center"><input type="text" id="t5" name="t5" size="20" /></td>
<td>地理：</td>
<td align="center"><input type="text" id="t6" name="t6" size="20" /></td>
</tr>
<tr>
<td align="center" colspan="2">
<input type="button" id="s1" name "s1" value="計算" onclick="fun1();" />
</td>
<td align="center" colspan="2">
<input type="button" id="r1" name "r1" value="清除" onclick="fun2();" />
</td>
</tr>
<tr>
<td>總分：</td>
<td align="center"><input type="text" id="sum" name="sum" size="20" value="" /></td>
<td>平均：</td>
<td align="center"><input type="text" id="avg" name="avg" size="20" value="" /></td>
</tr>
<tr>
<td align="center" colspan="4">
<textarea id="te1" name="te1" cols="64" rows="12"></textarea>
</td>
</tr>
</table>
</body>
===========================
<!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="Content-Type" content="text/html; charset=utf-8" />
<title>2016/12/30(2)</title>
<script language="javascript">
var pic=["x10.jpg","x11.jpg","x12.jpg","x13.jpg","x14.jpg","x15.jpg","x16.jpg","x17.jpg","x18.jpg","x19.jpg"];
var picno=pic.length;
var curpno=0; var msg="";
function funA(f) {
switch (f)
{
case 1: {
curpno=0;
break; }
case 2: {
curpno=curpno+1;
if (curpno > picno-1)
{ curpno = picno-1; msg="已經是末張"; }
break; }
case 3: {
curpno=curpno-1;
if (curpno < 0)
{ curpno = 0; msg="已經是首張"; }
break; }
case 4: {
curpno = picno-1;
break; }
default: {
break; }
}
if (msg=="")
document.getElementById("pic1").src="image/"+pic[curpno];
else { alert(msg); msg="";}
}
</script>
</head>

<body>
<center>
<table id="tb2" name="tb2" border="1" width="750">
<tr><td colspan="4" align="center" style="font-size:18px">美麗的圖片</td></tr>
<tr><td colspan="4">
<div>
<img id="pic1" src="image/x10.jpg" width="750" height="450" />
</div>
</td></tr>
<tr>
<td width="25%" align="center">
<input type="button" id="b1" name "b1" value="首  張" style="font-size:18px" onclick="funA(1);" />
</td>
<td width="25%" align="center">
<input type="button" id="b2" name "b2" value="下一張" style="font-size:18px" onclick="funA(2);" />
</td>
<td width="25%" align="center">
<input type="button" id="b3" name "b3" value="上一張" style="font-size:18px" onclick="funA(3);" />
</td>
<td width="25%" align="center">
<input type="button" id="b4" name "b4" value="末  張" style="font-size:18px" onclick="funA(4);" /></a>
</td>
</tr>
</table>
</center>
</body>
</html>

沒有留言:

張貼留言

訂閱：張貼留言 (Atom)