javascript基础代码

于 2014-02-16 23:50:04 发布
阅读量708 收藏
点赞数
分类专栏： HTML、CSS、javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/escdelete/article/details/19297145
版权

01-JS(javascript和html的结合方式)

<!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=gb2312" />
	<title>博客日志</title>
	<!-- javascript与html结合的第一种方式-->
	<script type="text/javascript">
		function demo(){
			alert("demo run......");
		}
	</script>
	
	<!-- javascript与html结合的第二种方式-->
	<script type="text/javascript" src="js/demo.js"></script>

</head>

<body>
	<input type="button" value="按钮"  οnclick="demo()"/>
</body>
</html>

02-JS(变量、运算符) 

<!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=gb2312" />
	<title>博客日志</title>

</head>

<body>
	<script>
		var x=3;
		x=2154/1000*1000;
		x=3.1+2.1;
		x=2.1+1.9;
		x="heihei";
		x="44"+1;
		x="34"-1;
		x=true+1;
		x=false-1;
		alert(x);
		
		//在js中查看变量的数据类型
		var i=4;
		alert(typeof(i));
		
		//在就是中变量不初始化，不会报错，会默认给变量一个undefined的值
		
	</script>
</body>
</html>

03-JS(语句) 

<!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=gb2312" />
	<title>博客日志</title>

</head>

<body>
	<script>
		/*if语句
		var x=3;
		if(x==3){
			alert("ok...");
		}
		else{
			alert("no no ");
		}
		*/
		/*switch语句
		var x=3;
		switch(x){
			case 1:
				alert("hello");
				break;
			case 2:
				alert("javascript");
				break;
			case 3:
				alert("haha");
				break;
			default:
				alert("没有满足条件的");
				
		}
		*/
		
		/*循环语句
		var x=4;
		while(x>0){
			alert(x);
			x--;
		}
		*/
		
		for(var x=0;x<5;x++){
			alert(x);
		}
	</script>
</body>
</html>
04-JS(数组) 

<!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=gb2312" />
	<title>博客日志</title>

</head>

<body>
	<script>
		方式一
		var arr=[1,24,15,45,4];
		for(var x=0;x<arr.length;x++){
			alert(arr[x]);
		}
		
		方式二
		var arr1=new Array(5);
	</script>
</body>
</html>
JS(数组练习-99乘法表 

<!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=gb2312" />
	<title>博客日志</title>

</head>

<body>
	<script>
		document.write("<table>");
		for(var x=1;x<=9;x++){
			document.write("<tr>");
			for(var y=1;y<=x;y++){
				document.write("<td>");
				document.write(x+"*"+y+"="+x*y);
				document.write("</td>");
			}
			document.write("<br />");
			document.write("</tr>");
		}
		document.write("</table>");
	</script>
</body>
</html>
JS(函数) 

<!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=gb2312" />
	<title>博客日志</title>

</head>

<body>
	<script>
		/*普通函数*/
		function demo(){
			var x="a";
			if(x=="a"){
				alert("ok....");
			}
			else{
				alert("no no no");
			}
		}
		
		demo();
		
		/*匿名函数*/
		var demo=function(){
			var x="a";
			if(x=="a"){
				alert("ok....");
			}
			else{
				alert("no no no");
			}
		}
		
		demo();
		
		
		/*动态函数*/
		
		var func = new Function("x","y","alert(x+y)");
		
		func("hello","world");
		
		
		/*带有参数 无返回值*/
		
		function add(s){
			alert("hah");
		}
		add("a");
		
		
		/*带有参数 有返回值*/
		function add1(s){
			return "heihei";
		}
		alert(add1("a"));
		
	</script>
</body>
</html>
09-JS（内置对象String） 

<!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=gb2312" />
	<title>博客日志</title>

</head>

<body>
	<script>
		var str="hello";
		alert(str.big());
		document.write(str.big());
		
		var result=str.substr(2,3);
		var result1=str.substring(2,3);
		
		alert(result);
		alert(result1);
	</script>
</body>
</html>
10-JS（内置对象Date） 

<!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=gb2312" />
	<title>博客日志</title>

</head>

<body>
	<script>
		var d=new Date();
		var year=d.getFullYear();
		var month=(d.getMonth())+1;
		var day=d.getDate();
		var weekday=d.getDay();
		alert(year+"年"+getMonth(month)+"月"+day+"日"+getWeekDay(weekday));
		function getMonth(month){
			if(month<10){
				return "0"+month;
			}
			else{
				return month;
			}
		}
		
		function getWeekDay(weekday){
			var arr=["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];
			return(arr[weekday]);
		}
		
		
		
		var time="2/17/2014";
		var number=Date.parse(time);
		//alert(number);
		var day=new Date(number);
		//alert(day);
		alert( day.toLocaleString() );
		
	</script>
</body>
</html>
11-JS（内置对象Array） 

<!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=gb2312" />
	<title>博客日志</title>

</head>

<body>
	<script>
		var arr=[1,2,5,4,8,7];
		var arr1=["hello","java"];
		var result=arr.concat(arr1);
		alert(result);
		
		var str=arr.join("*");
		alert(str);
		
	</script>
</body>
</html>
12-JS(内置对象-Math) 

<!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=gb2312" />
	<title>博客日志</title>

</head>

<body>
	<script>
		for(var x=0;x<5;x++){
			var number=parseInt(Math.random()*10+1);
			alert(number);
		}
	</script>
</body>
</html>
13-JS(内置对象-Global、Number) 

<!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=gb2312" />
	<title>博客日志</title>

</head>

<body>
	<script>
		var x="3c";
		var a=parseInt(x,"16");
		alert(a);
		
		
		var y=60;
		alert(y.toString(16));
	</script>
</body>
</html>
14-JS(内置对象-arguments) 

<!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=gb2312" />
	<title>博客日志</title>

</head>

<body>
	<script>
		function add(a,b){
			alert(a+"...."+b);
			
			alert(arguments.legth);
			for(var x=0;x<arguments.length;x++){
				alert(arguments[x]);
			}
		}
		
		add(4,5,8,6,6,3,8);
	</script>
</body>
</html>
15-JS((为内置对象添加自定义功能) 

<!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=gb2312" />
	<title>博客日志</title>

</head>

<body>
	<script>
		Array.prototype.getMax=function(){
			var max=this[0];
			for(var x=0;x<this.length;x++){
				if(this[x]>max){
					max=this[x];
				}
			}
			return max;
		}
		
		
		var arr=[5,6,6,8,5,8];
		
		alert(arr.getMax());
	</script>
</body>
</html>
以上是javascript的基本的用法，需要熟练的掌握！


评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值