JavaScript小例子
1. alert.html
<html>
<head>
<title></title>
<script type="text/javascript">
function alert_test()
{
alert("this is a alert")
}
</script>
</head>
<body>
<input type="button" onclick="alert_test()" value='click it'/>
</body>
</html>
2. break.html
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
for(i=0;i<10;i++)
{
if(i==3) break
document.write("This is number " + i + "</br>")
}
</script>
</body>
</html>
3. confirm.html
<html>
<head>
<title></title>
<script type="text/javascript">
function show_confirm()
{
var r = confirm("Please choose OK or Cancel")
if(r == true){
alert("you have click OK")
}else
alert("you have click Cancel")
}
</script>
</head>
<body>
<input type="button" onclick="show_confirm()" value="show a confirm box"/>
</body>
</html>
4. continue.html
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
for(i=0;i<10;i++)
{
if(i==3) continue
document.write("This is number " + i + "</br>")
}
</script>
</body>
</html>
5. cookie.html
<html>
<head>
<title></title> <script type="text/javascript">
function setCookie(c_name,c_value,expiredays) //debug has passed....
var c_date = new Date()
c_date.setDate(c_date.getDate() + expiredays)
document.cookie = c_name + "=" + escape(c_value) + ((expiredays == null)? "" : ";expiredays=" + c_date.toUTCString())
} function getCookie(c_name)
{
if(document.cookie.length>0)
{
c_start = document.cookie.indexOf(c_name + "=")
if(c_start != -1)
{
c_start = c_start + c_name.length + 1
c_end = document.cookie.indexOf(";",c_start)
if (c_end = -1)
{
c_end = document.cookie.length
};
return document.cookie.substring(c_start,c_end)
} }
return ""
}
function checkCookie()
{
var namecookie = getCookie("username")
if (namecookie !=null && namecookie!="")
{
document.write("hello,"+ namecookie + ",welcome again...")
return
};
var inputname = prompt("Please enter your name...","")
if (inputname != null && inputname!="")
{
setCookie("username",inputname,7)
};
} </script>
</head>
<body onload="checkCookie()"> </body>
</html>
6. declarationvar.html
<html>
<head>
<title>this is title</title>
</head>
<body>
<script type="text/javascript">
var firstname
firstname = "George"
document.write(firstname)
document.write("<br></br>") var lastname
lastname = "John"
document.write(lastname)
</script>
</body>
</html>
7. dowhile.html
<html>
<head>
<title></title>
</head>
<body> <script type="text/javascript">
var i = 0
do{
document.write("This is number " + i +"<br/>")
i++
}while(i<6)
</script> </body>
</html>
8. for.html
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
for(i=0;i<6;i++)
{
document.write("The number is" + " " + i + "<br/>")
}
</script> </body>
</html>
9. forArray.html
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
var nameArray = new Array()
nameArray[0]="Jim"
nameArray[1]="Tom"
nameArray[2]="Lily" var x
for(x in nameArray)
{
document.write(nameArray[x] + "<br/>")
}
</script>
</body>
</html>
10. functionwithPara.html
<html>
<head>
<script type="text/javascript">
function myfunction(para1)
{
document.write(para1)
}
</script>
</head>
<body>
<input type="button" onclick="myfunction('Hello')" value="click it">
</body>
</html>
11. functionwithPara2.html
<html>
<head>
<title></title>
<script type="text/javascript">
function myfunction(para1)
{
alert(para1)
}
</script>
</head>
<body>
<input type="button" onclick="myfunction('Morning...')" value="Good Morning Clock">
<input type="button" onclick="myfunction('Evening...')" value="Good Evening Clock">
</body>
</html>
12. functionwithReturn.html
<html>
<head>
<title></title>
<script type="text/javascript">
function myfunction()
{
return ("Hi,this is function return...")
}
</script>
</head>
<body>
<script type="text/javascript">
document.write(myfunction())
</script>
</body>
</html>
13. getcookie_test.html
<html>
<head>
<title></title>
<script type="text/javascript">
function getCookie(c_name) //dubug has passed
{
if(document.cookie.length>0)
{
c_start = document.cookie.indexOf(c_name + "=")
document.write(c_start + "<br/>")
document.write(document.cookie+ "<br/>")
if(c_start != -1)
{
c_start = c_start + c_name.length + 1
document.write(c_start+ "<br/>")
c_end = document.cookie.indexOf(";",c_start)
document.write(c_end+ "<br/>")
if (c_end == -1)
{
c_end = document.cookie.length
};
document.write(c_end)
return document.cookie.substring(c_start,c_end)
} }
return "cookie is not fined" } var testget = getCookie("username")
alert(testget) </script>
</head>
<body> </body>
</html>
14. headlineFor.html
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
document.write("<h1>This is headline 1</h1>")
for(i=1;i<6;i++)
{
document.write("<h" + i + ">" + "This is headline" + i +"</h" + i + ">")
}
</script>
</body>
</html>
15. helloWorld.html
<html>
<script>
document.write("Hello World!!!")
</script>
</html>
16. helloWorld2.html
<html> <script type="text/javascript">
document.write("<h1>Hello World....</h1>")
</script>
</html>
17. if.html
<html>
<head>
<title>this is title</title>
</head>
<body>
<script type="text/javascript">
var d = new Date()
var time = d.getHours() if(time>12)
{
document.write("<b>Good Afternoon</b>")
}
else
document.write("this is else branch...")
</script>
</body>
</html>
18. ifElseIf.html
<html>
<head>
<title>this is title</title>
</head>
<body>
<script type="text/javascript">
var score = 50 if(score>=60 && score<80)
{
document.write("Good")
}
else if (score>=80)
{
document.write("Excellent")
}
else
document.write("Sorry,You have not passed")
</script>
</body>
</html>
19. imageMap.html
<html>
<head>
<title></title>
<script type="text/javascript">
function writetext(txt)
{
document.getElementById("desc").innerHTML=txt //"" and '' is different Please Notice
}
</script>
</head>
<body> <img src="eg_planets.jpg" usemap="#planetmap">
<map id="planetmap" name="planetmap">
<area shape="circle" coords="180,139,14" href="alert.html" onmouseover="writetext('The Venus...')" />
<area shape="circle" coords="129,161,10" href="alert.html" onmouseover="writetext('The Mercury...')" />
<area shape="rect" coords="0,0,110,260" href="alert.html" onmouseover="writetext('The Sun...')" />
</map>
<p id="desc"> </p> </body>
</html>
20. mouse.html
<html>
<head>
<title></title>
<script type="text/javascript">
function mouseOver()
{
document.image01.src="eg_mouse.jpg"
} function mouseOut()
{
document.image01.src="eg_mouse2.jpg"
}
</script> </head>
<body>
<a href="alert.html" target="_blank">
<img name="image01" src="eg_mouse2.jpg" onmouseover="mouseOver()" onmouseout="mouseOut()">
</a>
</body>
</html>
21. randomLink.html
<html>
<head>
<title>this is title</title>
</head>
<body>
<script type="text/javascript">
var r = Math.random()
if (r>0.5) {
document.write("<a href = 'http://www.baidu.com'>please access BaiDu.</a>")
}else
document.write("<a href = 'http://10.0.111.154:8080'>please access jira</a>") </script> </body>
</html>
22. scriptInBody.html
<html>
<head>
<title>this is title</title>
</head>
<body onload="message()">
<script type="text/javascript">
function message()
{
alert("script is in body...")
}
</script>
</body>
</html>
23. scriptInHead.html
<html>
<head>
<title>title is null</title>
<script type="text/javascript">
function message()
{
alert("script is in head...")
}
</script>
</head>
<body onload="message()">
</body>
</html>
24. scriptIsOut.html
<html>
<head>
<title>this is title...</title>
<script type="text/javascript" src="script.js"></script>
</head>
<body onload="message()">
</body>
</html>
25. setcookie_test.html
<html>
<head>
<title></title>
<script type="text/javascript">
function setCookie(c_name,c_value,expiredays) //debug has passed....
{
var c_date = new Date()
c_date.setDate(c_date.getDate() + expiredays)
document.cookie = c_name + "=" + escape(c_value) + ((expiredays == null)? "" : ";expiredays=" + c_date.toUTCString())
}
</script>
</head>
<body>
<input type = "button" value="click" onclick="setCookie('username','1234456',7)" >
</body>
</html>
26. throw.html
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
var num = prompt("Please enter a number between 1 and 10","")
try
{
if(num<0)
throw "Error1"
else if(num>10)
throw "Error2"
else if(isNaN(num))
throw "Error3"
}catch(err)
{
if(err=="Error1")
alert("too small...")
if(err=="Error2")
alert("too large...")
if(err=="Error3")
alert("It is not a number...")
} </script> </body>
</html>
27. timer.html
<html>
<head>
<title></title>
<script type="text/javascript">
function timeMsg()
{
var t=setTimeout("alert('3 second has passed...')",3000)
}
</script>
</head>
<body> <input type="button" value="click it" onclick="timeMsg()"> </body>
</html>
28. timer2.html
<html>
<head>
<title></title>
<script type="text/javascript">
function timeMsg()
{
var t1 = setTimeout("document.getElementById('showText').value='2 second has passed...' ",2000)
var t1 = setTimeout("document.getElementById('showText').value='4 second has passed...' ",4000)
var t1 = setTimeout("document.getElementById('showText').value='6 second has passed...' ",6000)
}
</script>
</head>
<body>
<input type="button" value="click it" onclick="timeMsg()">
<input type="text" id="showText">
</body>
</html>
28. timer3.html
<html>
<head>
<title></title>
<script type="text/javascript">
var c = 0
var t
function timeMsg()
{
document.getElementById("showTime").value=c
c=c+1
t=setTimeout("timeMsg()",1000)
} </script>
</head>
<body> <input type="button" value="click it" onclick="timeMsg()">
<input type="text" id="showTime"> </body>
</html>
29. timer4.html
<html>
<head>
<title></title>
<script type="text/javascript">
var c = 0
var t
function timeMsg()
{
document.getElementById("showTime").value=c
c=c+1
t=setTimeout("timeMsg()",1000)
} function timerstop()
{
c = 0
clearTimeout(t)
document.getElementById("showTime").value=0
} </script>
</head>
<body> <input type="button" value="click it" onclick="timeMsg()">
<input type="text" id="showTime">
<input type="button" value="click it to stop" onclick="timerstop()"> </body>
</html>
30. try.html
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
var txt=""
function myfunction()
{
try
{
allert("this is a alert...")
}catch(err)
{
txt="there is an error... \n\n"
txt+="Error Description:" + err.description + "\n\n"
txt+="Please press Enter to continue... \n\n"
alert(txt)
}
}
</script> <input type="button" onclick="myfunction()" value="click it">
</body>
</html>
31. try2.html
<html>
<head>
<title></title>
<script type="text/javascript">
var txt
function myfunction()
{
try
{
alllert("this is a right alert...")
}catch(err)
{
txt = "There is an error in this page... \n"
txt += "Press Enter to continue,Press Cancle to back... \n"
var r = confirm(txt)
if(!r) //Here bug
{
document.location.href("WriteText.html")
}
}
}
</script>
</head>
<body>
<input type="button" onclick="myfunction()" value="click it">
</body>
</html>
32. while.html
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
var i=0;
while(i<6)
{
document.write("This is number " + i +"<br/>")
i++
}
</script>
</body>
</html>
33. writeText.html
<html>
<head>
<title>this is title</title>
</head>
<body>
<script type="text/javascript">
document.write("<h1>this is headline...</h1>")
document.write("<p>this is a paragraph...</p>")
document.write("<p>this ia another paragraph...</p>")
</script>
</body>
</html>
JavaScript小例子的更多相关文章
- JavaScript小例子：复选框全选
JavaScript小例子:复选框全选 这只是一个小例子,很简单,但是这个功能还是很常用的: 实现后效果如图: JavaScript代码: <script type="text/jav ...
- javascript小例子：實現四方向文本无缝滚动效果
实现一个文本无缝滚动的效果: <!DOCTYPE html> <!--[if lt IE 7 ]> <html lang="zh-CN" class= ...
- 五个小例子教你搞懂 JavaScript 作用域问题
众所周知,JavaScript 的作用域和其他传统语言(类C)差别比较大,掌握并熟练运用JavaScript 的作用域知识,不仅有利于我们阅读理解别人的代码,也有助于我们编写自己的可靠代码. 下面笔者 ...
- 【zTree】 zTree使用的 小例子
使用zTree树不是第一次了 但是 还是翻阅着之前做的 对照着 使用起来比较方便 这里就把小例子列出来 总结一下使用步骤 这样方便下次使用起来方便一点 使用zTree树的步骤: 1.首先 在 ...
- Ajax入门小例子
大牛文章:http://www.cnblogs.com/guduoduo/p/3681296.html ---Ajax基础学习 http:/ ...
- JS模拟键盘事件 -- 原理及小例子
提问: 键盘默认事件,比如tab切换,alt+f4关闭,ctrl+t新建等,如果不想通过键盘而是一些按钮点击来触发这些功能,该咋办呢? 例子: 先以tab为例上一个小例子: <!DOCTYPE ...
- php+jquery+ajax+json简单小例子
直接贴代码: <html> <title>php+jquery+ajax+json简单小例子</title> <?php header("Conte ...
- C# Newtonsoft.Json解析数组的小例子[转]
https://blog.csdn.net/Sayesan/article/details/79756738 C# Newtonsoft.Json解析数组的小例子 http://www.cnblog ...
- 前端小例子 基础js css html练习
前情提要: 学前端也有一阵了,个人感觉前端还是重要的. html 学习教程 https://www.cnblogs.com/baili-luoyun/p/10466040.html css 教程 js ...
随机推荐
- Ubuntu双系统环境下隐藏掉其他开机启动项
系统环境:ubuntu16.04需求:PC装的双系统(ubuntu+win10),为了应对某些需求,需要将win10系统给从电脑上消失,让你看不见也进不去它.做法:当然不可能真的删除掉win10系统, ...
- Debian Gun/linux基本用法
添加软件源:vim /etc/apt/sources.list 在文本中添加如下内容:deb http://mirrors.163.com/debian/ stretch main non-free ...
- Ubuntu 添加删除用户 How to Add and Delete Users on Ubuntu 16.04
Introduction One of the most basic tasks that you should know how to do on a fresh Linux server is ...
- 手动配置wnmp环境
wamp 是什么? windows,nginx,mysql,php(当然也可以是PYTHON等) 只所以使用nginx,是因为我等下要配置ZendGuardLoader ZendGuardLoader ...
- session 之session混乱解决方法(转)
知道了session混乱产生的原因之后,也就知道了问题的根源.同时也引出了很多的问题: 1.如何记录住在线人员(这里只有帐号的系统用户,不包括访客): 2.如何限制同一个帐号在同一时间段内只能够登陆一 ...
- Oracle EBS AP 供应商取值
SELECT --nvl(substr(po.vendor_name,1,instr(po.vendor_name,',',1)-1),po.vendor_name) vendor_name, po. ...
- Sqlserver2014 迁移数据库
由于当初安装sqlserver 的时候选择默认安装的路径,导致现在c盘爆满,安装不了其它软件.因此想到了迁移数据库,网上搜索了一些简介,但是缺少一些步骤,导致数据库附加的时候失败.现总结如下: 1.将 ...
- Java简单的数据库连接
package test.postgre; import java.sql.Connection; import java.sql.DriverManager; import java.sql.Res ...
- C# Json转对象
第一步,项目添加negut的搜索Newtonsoft.Json,安装第一个:如图所示: 安装以后,自动引用. private ObservableCollection<Traffic> m ...
- VS C#程序打包覆盖安装不能更新的解决方法
最近写个小程序,打包覆盖安装更新时老是不起作用,还是原来的程序. 在网上四处查找,productcode和ersion都已经更改,removepreviousversions也设置成true了,可就是 ...