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
DOM1.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>
最新文章
- HDU2818 并查集
- 如何让Log4net日志文件按每月归成一个文件夹，StaticLogFileName参数的用法
- 开源是一种态度、分享是一种精神 — FirApi发布、WeiXinApi更新
- UE简单操作
- [算法][C]计算向量的角度
- C：进制
- C#加密算法汇总(转载)http://www.cnblogs.com/zengxiangzhan/archive/2010/01/30/1659687.html
- Ratchet（WebSockets for PHP）的官方TUTORIALS 的实践
- xml约束之schema
- (转)Oracle Data Guard学习
- 查找jar包的站点
- BUG: scheduling while atomic: events/0/4/总结
- 网络爬虫构造出URL的列表数据
- vue:资源小记
- linux shell脚本调用java main方法 代码传值
- spring-web-4.3.3与spring-webmvc-4.3.3的区别
- Docker帮助命令
- php里获取第一个中文首字母并排序
- P1516/bzoj1477 青蛙的约会
- Android设计模式之单例模式