javascript小节

javascript 语法总结

知识概要：

（1）Javascript概述

1.1javascript是什么？

1.2JavaScript语言组成

1.3JavaScript与Html的结合方式

（2）JavaScript基本语法

（3）JavaScript常用对象介绍

（4）JavaScript 函数的定义

1.1javascript是什么？

1.基于对象和事件驱动的脚本语言（它要求放在浏览器中去解析）

2.无需编译，可由浏览器直接解释运行

3.JavaScript 是一种弱类型语言

交互性（它可以做的就是信息的动态交互）

安全性（不允许直接访问本地硬盘）

跨平台性（只要是可以解释Js的浏览器都可以执行，和平台无关）

1.2JavaScript语言组成

JavaScript语言组成

ECMAScript核心语法

BOM

DOM

1.3JavaScript与Html的结合方式

1.直接在事件中写

   onclick="javascript:alert('Hello World')"

2. 通过<script>标签写

  <script type="text/javascript">

   //alert("Hello World");弹框

   document.write("<h1>Hello World!</h1>");//在网页上输出//System.out.println("");

  </script>



  1.<script>可以写在网页的地方

  2.一般写在<head>部分

  3.除非咱们要网页的body部分打印输出时，才把它放在body部分

  3.引入外部js文件

  <script type="text/javascript" src="demo3.js" >



  </script>

  注意:

   通过这种方式引入外部js文件,在内部所写的js代码是不会执行的。

(2)JavaScript基本语法

1.变量

2.数据类型

   Undefined、Null、Boolean、Number 和 String

1.Undefined

1.变量定义了，但是没有赋值

2.通过typeof()测试，结果也是undefined

2.Null

1.通过alert()直接输出，得到一个null结果

2.通过typeof()测试，它的结果是一个Object

3.Boolean

看赋值为true/false

非0都为真

0都为假

4.Number

不区分整数与小数都认为是number

5.String

用“”引号引上的

未定义直接拿变量用,这样使用是语法错

var s="1"//定义了一个基本类型的字符串

var s = new String("1");//定义了一个String对象

基本类型为什么能调方法？

s.toString();//说明了javascript是弱数据类型，它底层已经做了转化

6.运算符

==值相等 ===类型和值都要相等

7.控制语句

if/else/else if

switch (字符串)

三元运算符条件？值1:值2;   (条件)null,false,0,'',undefined,NaN为假,其它都为真

for/while/do.while

(3)JavaScript常用对象介绍

Array对象数组对象，进行数组操作

String对象 ----- 字符串类型的引用类型

var s = new String("itcast");

Number对象 ---- 数字原始类型引用类型

var n = new Number(100);

Boolean对象 ---- 布尔原始类型引用类型

var b = new Boolean(true);

Math对象执行数学任务

Date对象用于处理日期和时间

RegExp 对象正则表达式对象

(4)javascript 函数对象

1.第一种方式

function函数名(){

}

2.第二种方式

/*var show = function (){

  alert("Hello");

}*/

//alert(show);//当成变量看，输出function

//show();//调用变量名()

3.第三种方式参数：前面都是参数，函数体是最后一个参数

var show = new Function("a","b","return a+b");

function show(a,b){

return a+b;

}

4.全局函数

//parseInt();转整数

//parseFloat();//转小数

//eval() eval() 函数可计算某个字符串，并执行其中的的 JavaScript 代码。

//escape() 函数可对字符串进行编码，这样就可以在所有的计算机上读取该字符串。

//unescape() 函数可对通过 escape() 编码的字符串进行解码。

//isNaN()//判断是否为数字为数字返回false 不为数字返回true

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

 <head>

  <title> js概述 </title>

  <!--

	js是什么?

		javascript代码，它是一门脚本语言,可以写业务逻辑，

		基于对象的语言，基于事件驱动的语言，是弱数据类型语言

		由浏览器直接解释运行

	三种结合方式:

		1.事件名="js代码",javascript:var a=1;alert(a);

		2.通过<script></script>标签引入

		3.外部js文件

		   <script type="text/javascript" src="js文件"/>

  -->

  <script type="text/javascript">

	//1.定义一个变量a

	var a =1;

	document.write("变量a="+a);//在网页上输出的

  </script>

  <script type="text/javascript" src="01.js"></script>

 </head>

 <body>

	<input type="button" value="javascript:var a=1;alert(a);" onclick="alert('我帅吗？')"/>

	<a href="javascript:var a=1;alert(a);">百度</a>

 </body>

</html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

 <head>

  <title>数组对象</title>

  <!--language="javascript"  -->

  <script >

	 //定义一个数组

	 var a = new Array();

	 var scores = new Array(5);//5代表长度

	 var scroesjava = new Array(5,6);//代表有元素5,6

	 var scoresandroid = [90,"54",80,70,30,60,"cgx","aj"];//定义一个数组，元素是90,100

	 //添加元素

	 //alert(scores.length);//5

	 //alert(a.length);//0

	 scores[100] = "cgx";

	// alert(scores[100]);

	//scores[101] = new Date();

	//alert(scores[99]);

	scoresandroid.sort();//排序

	//alert(scoresandroid.join("~~~~~~~~~~~~~~~~"));//用指定的分隔符进行连接

	//var t = scoresandroid.pop();//最后一个位置删除

	//alert(t);

	//var x = scoresandroid.shift();

	//alert(x);

	scoresandroid.unshift("shit");

	//alert(scoresandroid.join("~~~~~~~~~~~~~~~~"));

	for(var i=0;i<scoresandroid.length;i++){

		if(i!=scoresandroid.length-1)

		   document.write(scoresandroid[i]+",");

		else

			document.write(scoresandroid[i]);

	}

  </script>

 </head>

 <body>

 </body>

</html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

 <head>

  <title> RegExp对象</title>

  <script>

	/*function validation(obj){

		//1.得到文本框的值

		//var name =   document.getElementById("username").value;

		var name = obj.value;

		//2.定义一个正则表达式

		var regexp = new RegExp("[a-zA-Z]{6,10}");

		//3.匹配

		var bvalue = regexp.test(name);

		//4.判断

		if(bvalue){

			alert("用户名格式正确");

		}else{

			alert("用户名格式错误，只能6-10位字母组成");

		}

	}*/

	//调用函数规则一般:事件名="函数名()"

	//onclick:点击

	//onblur:失去焦点  onblur="validation(this)" this代表当前的标签

	//onfocus:得到焦点

	//即时的消息提示

	function validationsw(obj){

		//1.得到文本框的值

		 //var name =   document.getElementById("username").value;

		 var name = obj.value;

		//2.定义一个正则表达式

		var regexp = new RegExp("^[a-zA-Z]{6,10}$");

		//3.匹配

		var bvalue = regexp.test(name);

		//根据id找到div

		var errorsw = document.getElementById("errorMsg");

		//4.判断

		//innerHTML代表的是<div></div>中间的文本,而且能识别html标签

		//innerText:代表的是<div></div>中间的文本,但不能识能html标签

		if(bvalue){

			errorsw.innerHTML="<font color='red'>用户名格式正确</font>";

		}else{

			errorsw.innerHTML="<font color='red'>用户名格式错误，只能6-10位字母组成</font>";

		}

	}

	function clearText(objhsw){

		var hswvalue = objhsw.value;

		if(hswvalue == "只能6-10位字母组成"){

			objhsw.value="";

		}

	}

	function changeChar(obj){

		var source = obj.value;

		if(source!="只能是6-10位的字母组成"){

			var regExp = new RegExp("^[a-zA-Z]{6,10}$");

			flag = regExp.test(source);

		}

		var errorsw = document.getElementById("errorMsg2");

		if(!flag){

			errorsw.innerHTML = "<font color='red'>只能是6-10位的字母组成</font>";

		}else{

			errorsw.innerHTML = "<font color='green'>ok</font>";

		}

	}

  </script>

 </head>

 <body>

	<input type="text" value="只能6-10位字母组成" id="username" name="username" onfocus="clearText(this)" onblur="validationsw(this)" />

	<div id="errorMsg" style="display:inline;"></div>

	<hr size="3cm" color="blue"/>

	<input id="source" type="text" value="只能是6-10位的字母组成" size="30" onchange="changeChar(this)" />

	<div id="errorMsg2" style="display:inline;"></div>

 </body>

</html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

 <head>

  <title>全局函数</title>

	<script>

	 /*

		如何根据name属性去得到一个标签?

		document.getElementsByName("name属性的值");

	 */

		var a = 3.9415926;

		//alert(parseInt(a));

		function calc(op){

			//1.得到前两个框的值

			var objNo1Val  =parseFloat( document.getElementsByName("no1")[0].value);

			var objNo2Val  =parseFloat( document.getElementsByName("no2")[0].value);

			//2.得到操作符,参数中给了

			//3.进行计算

			var result ;

			switch(op){

				case "add":

					result=objNo1Val+objNo2Val;

				break;

				case "sub":

					result=objNo1Val-objNo2Val;

				break;

				case "multi":

					result=objNo1Val*objNo2Val;

				break;

				case "divide":

					result=objNo1Val/objNo2Val;

				break;

				default:

					result="对不起,你有病！";

			}

			//4.显示结果

			document.getElementsByName("result")[0].value=result;

		}

	</script>

 </head>

 <body>

	第一个数:<input type="text" name="no1"/><br/>

	第二个数:<input type="text" name="no2" /><br/>

	结果:<input name="result"/><br/>

	<input type="button" onclick="calc('add')" value="    +    "/>

	<input type="button" onclick="calc('sub')" value="    -    "/>

	<input type="button" onclick="calc('multi')" value="    *    "/>

	<input type="button" onclick="calc('divide')" value="    /    "/>

 </body>

</html>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

 <head>

  <title> New Document </title>

  <script>

			//escape编码

			var str ="http://www.itheima.com?keyword=老王玉照";

			var str1 = encodeURI(str);

			alert(str1);

			var str2 = decodeURI(str1);

			alert(str2);

			//----------eval-------------

			var result = eval("123+234");

			alert(result);

  </script>

 </head>

 <body>

 </body>

</html>

javascript小节的更多相关文章

《JavaScript高级程序设计》读书笔记（三）基本概念第三小节 String、Object类型
内容---语法上一小节---数据类型本小节 String类型---流程控制语句---理解函数 String类型--零个或者多个16位Unicode字符组成字符序列,即字符串--可以由双引号&quo ...
《JavaScript高级程序设计》读书笔记（三）基本概念第一小节
内容---语法本小节---数据类型本小节 undefined,null,Boolean---流程控制语句---理解函数任何语言的核心都必然会描述这门语言最基本的工作原理.而描述的内容通常都要涉及 ...
《JavaScript高级程序设计》读书笔记（三）基本概念第六小节理解函数
内容---语法---数据类型---流程控制语句上一小节---理解函数本小节函数--使用function关键字声明,后跟一组参数以及函数体 function functionName(arg0, ...
《JavaScript高级程序设计》读书笔记（三）基本概念第四小节操作符
内容---语法上一小节---数据类型本小节操作符---流程控制语句---理解函数操作符--操作数据值的操作符--算术(如加减).位操作符.关系.相等--ECMAScript操作符可以适用于很多 ...
《JavaScript高级程序设计》读书笔记（三）基本概念第二小节 Number类型
内容---语法上一小节---数据类型本小节 number类型---流程控制语句---理解函数 number类型--使用IEEE754格式来表示整数和浮点数值(双精度数值)--规定了数值字面量格式, ...
JavaScript—暂告，小节
Javastript 的学习告一段落了.虽然还有更多的:爬虫什么的但是和我在学校的相比要扎实许多.知道了兼容性面向对象,闭包.....一些细节的用法. 虽然以后可能很少用到.可是我觉得 ...
JavaScript权威指南 - 对象
JavaScript对象可以看作是属性的无序集合,每个属性就是一个键值对,可增可删. JavaScript中的所有事物都是对象:字符串.数字.数组.日期,等等. JavaScript对象除了可以保持自 ...
SuperMap iClient for JavaScript 新手入门
地理信息系统(英语:Geographic Information System,缩写:GIS)是一门综合性学科,结合地理学与地图学,已经广泛的应用在不同的领域,是用于输入.存储.查询.分析和显示地理数 ...
JavaScript正则表达式，你真的知道？
一.前言粗浅的编写正则表达式,是造成性能瓶颈的主要原因.如下: var reg1 = /(A+A+)+B/; var reg2 = /AA+B/; 上述两个正则表达式,匹配效果是一样的,但是,效率就 ...

随机推荐

react 入门
一:virtual DOM 虚拟DOM树在React中,render执行的结果得到的并不是真正的DOM节点,结果仅仅是轻量级的JavaScript对象,我们称之为virtual DOM. 虚拟DO ...
Java学习记录：降低耦合度
耦合度定义耦合度(Coupling)是对模块间关联程度的度量.耦合的强弱取决与模块间接口的复杂性.调用模块的方式以及通过界面传送数据的多少. 模块间的耦合度是指模块之间的依赖关系,包括控制关系.调用 ...
UTF-8编码规则【转】
hz_chenwenbiao UTF-8编码规则(转) UTF-8是Unicode的一种实现方式,也就是它的字节结构有特殊要求,所以我们说一个汉字的范围是0X4E00到0x9FA5,是指unicode ...
EmEditor编辑器正则表达式的优点
(1)^[ \t]*\n这个正则表达式代表所有的空行,指含有零个或零个以上空格或制表符.以换行符结尾.不含其它字符的行.(2)(^|(?<=中国)).*?(?=中国|$)用正则表达式匹配特定字符 ...
第二次项目冲刺（Beta阶段）5.23
1.提供当天站立式会议照片一张会议内容: ①检查前一天的任务情况,将遇到的瓶颈反馈,看看团队成员是否有好的建议. ②制定新一轮的任务计划. 2.每个人的工作 (1)工作安排队员今日进展明日安排 ...
团队作业4——第一次项目冲刺（Alpha版本）4.22
团队作业4--第一次项目冲刺(Alpha版本) Day one: 会议照片由于团队中的组员今天不在学校,所以我们的站立会议提前一天展开. 项目进展由于今天是Alpha版本项目冲刺的第一天,所以没有 ...
201521123105 第10周Java学习总结
1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结异常与多线程相关内容. 2. 书面作业本次PTA作业题集异常.多线程 1.finally 题目4-21.1 截图你的提交结果(出现 ...
PTA中提交Java程序的一些套路
201708新版改版说明 PTA与2017年8月已升级成新版,域名改为https://pintia.cn/,官方建议使用Firefox与Chrome浏览器. 旧版 PTA 用户首次在新版系统登录时,请 ...
201521123081《java程序设计》第14周学习总结
1. PTA反馈问卷 2. 雨课堂反馈问卷本次作业参考文件数据库PPT MySql操作视频与数据库相关jar文件请参考QQ群文件. 0. 本周课程设计发布 Java课程设计 1. 本周学习总结 1 ...
201521123023《Java程序设计》第13周学习总结
1. 本周学习总结 (1)网络中为了进行数据交换(通信)而建立的规则.标准或约定(=语义+语法+规则)称之为协议(常用http/ftp) (2)大致熟悉了TCP协议,但是UDP怎么辣么蓝,好理解却用不 ...

javascript小节

javascript小节的更多相关文章

随机推荐

热门专题