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 ...
随机推荐
- BZOJ4977: [[Lydsy1708月赛]跳伞求生
传送门 直接贪心 考虑到 \(n\) 个人的贡献都是 \(a_i\),另外 \(m\) 个人的贡献都是 \(c_i-b_i\) 首先 \(a_i>b_j\) 的限制不好做,所以将 \(a,b\) ...
- .net开发环境搭建
本地开发环境下载网址:https://msdn.itellyou.cn/,选择个人免费版本 下载工具 下载安装win7系统选择asp.net 和web开发,右侧可选全部选择,大约11GB左右
- CRM Online Outlook Client Configuration Wizard
CRM Outlook客户端满足和便捷了用户对office outlook和CRM两个程序的使用需求.通过CRM outlook 客户端,用户可以像在浏览器中访问CRM一样,流畅的读写CRM数据.同时 ...
- Add map surrounds using the SymbologyControl
/ Copyright 2010 ESRI// // All rights reserved under the copyright laws of the United States// and a ...
- 润乾报表与DERBY数据库的创建连接详解
1. 问题概述 1.Derby数据库的创建过程 2.润乾报表连接Derby数据库展现数据 概述: Derby是Apache Software Foundation (ASF)的一个的孵化器项目. ...
- Jupyter notebook 使用多个Conda 环境
conda install nb_conda_kernels
- mvc5中重命名项目的名称后，出现"找到多个与名为“Home”的控制器匹配的类型"
1.已把项目中所有的Webapplication1改为了MvcMovie,但是运行后,还是报错: 找到多个与名为“Home”的控制器匹配的类型 2.已重新生成解决方安,还是不行. 解决方法:把bin文 ...
- Oracle EBS AR 更新客户账户层
declare x_return_status ); x_msg_count NUMBER; x_msg_data ); x_profile_id NUMBER; l_location_id NUMB ...
- Jmeter入门--脚本录制
一.Badboy脚本录制(推荐) 下载地址:http://www.badboy.com.au/download/add,下载完成后直接安装即可. Badboy是一个强大的工具,旨在帮助测试和开发复杂的 ...
- 几个很好用SQL语法（SqlServer）
1,MERGE INTO 语句: 这个语法仅需要一次全表扫描就完成了全部工作,执行效率要高于INSERT+UPDATE,作用还是很强大的(简单的说就是它可以批量更新和插入处理一个数据集,如果存在就更新 ...