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>
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/; 上述两个正则表达式,匹配效果是一样的,但是,效率就 ...
随机推荐
- SEO搜索引擎优化(一)
什么是SEO呢 英文为"Search Engine Optimization",中文名为"搜索引擎优化".SEO是指通过对网站进行站内优化和修复(网站Web结构 ...
- Springboot与Thymeleaf模板引擎整合基础教程(附源码)
前言 由于在开发My Blog项目时使用了大量的技术整合,针对于部分框架的使用和整合的流程没有做详细的介绍和记录,导致有些朋友用起来有些吃力,因此打算在接下来的时间里做一些基础整合的介绍,当然,可能也 ...
- 图论中DFS与BFS的区别、用法、详解…
DFS与BFS的区别.用法.详解? 写在最前的三点: 1.所谓图的遍历就是按照某种次序访问图的每一顶点一次仅且一次. 2.实现bfs和dfs都需要解决的一个问题就是如何存储图.一般有两种方法:邻接矩阵 ...
- CCNA基础知识摘录
cisco设备的启动要点: 1.检测硬件(保存在rom) 2.载入软件(IOS)(保存在Flash) 3.调入配置文件(密码,IP地址,路由协议都保存在此)(此文件保存在NVRAM) 0x2102:正 ...
- 新CCIE笔记-路由器的配置
CCIE重修笔记之路由器基本配置与最简单的路由. 路由器与交换机的基本配置命令 全局配置模式下有多种子模式 (华为可以跳跃切换模式) 思科命令行技巧 Tab键补全,也可以直接保留缩写 问号'?'类似l ...
- 201521123017 《Java程序设计》第7周学习总结
1. 本周学习总结 2. 书面作业 Q1.ArrayList代码分析 1.1 解释ArrayList的contains源代码 1.2 解释E remove(int index)源代码 1.3 结合1. ...
- 201521123115《Java程序设计》第7周学习总结
1. 本周学习总结 以你喜欢的方式(思维导图或其他)归纳总结集合相关内容. 2. 书面作业 1.ArrayList代码分析 1.1 解释ArrayList的contains源代码 1.2 解释E re ...
- 201521123036 《Java程序设计》第6周学习总结
本周学习总结 1.1 面向对象学习暂告一段落,请使用思维导图,以封装.继承.多态为核心概念画一张思维导图,对面向对象思想进行一个总结. 1.2 可选:使用常规方法总结其他上课内容. 对象克隆:Clon ...
- Python[小甲鱼-002用Python设计第一个游戏]
–Code——————————————————————- print("----------第一个小游戏----------") temp = input("猜一下我现在 ...
- 201521123028 《Java程序设计》第13周学习总结
本周学习总结 书面作业 网络基础 1.1 比较ping www.baidu.com与ping cec.jmu.edu.cn,分析返回结果有何不同?为什么会有这样的不同? Ans:cec.jmu.edu ...