第一章:JavaScript基础
为什么要学JavaScript
1:表单验证 2:页面动态效果
什么是JavaScript
JavaScript是一种基于对象和事件驱动的、跨平台的、并具有安全性能的脚本语言
JavaScript特点
1:向HTML页面中添加交互行为 2:脚本语言,语法和Java类似 3:解释性语言,边执行边解释
JavaScript组成
ECMAScript(核心): JavaScript的核心,描述了语言的基本语法(var、for、if、array等)和数据类型(数字、字符串、布尔、函数、对象(obj、[]、{}、null)、未定义),ECMAScript是一套标准,定义了一种语言(比如JS)是什么样子。 DOM(文档对象模型): DOM(文档对象模型)是 HTML 和 XML 的应用程序接口(API)。DOM 将把整个页面规划成由节点层级构成的文档。HTML 或 XML 页面的每个部分都是一个节点的衍生物。 BOM(浏览器对象模型): 对浏览器窗口进行访问和操作
JavaScript的基本结构
语法: <script type="text/javascript"> <!— JavaScript语句; —> </script> 备注:有的网页中用缺省type="text/Javascript",这种写法是正确的,因为HTML5中可省略type属性,HTML5默认为是text/Javascript。
JavaScript的简单应用
<title>初学JavaScript</title> </head> <body> <script type="text/javascript"> document.write("初学JavaScript"); document.write("<h1>Hello,JavaScript</h1>"); </script> </body> </html> 注意: 1:<script>…</script>可以包含在文档中的任何地方,只要保证这些代码在被使用前已读取并加载到内存中即可 2:document.write()方法可以向HTML输出流中插入你传入的内容,浏览器会按着HTML元素依次顺序依次解析它们,并显示出来。 需要注意的是,如果在文档加载完成后(即HTML输出已完成),再使用document.write()方法来要求浏览器来解析你的内容 则浏览器就会重写整个document,导致最后的这个document.write()方法输出的内容会覆盖之前所有的内容。
网页中引用JavaScript的方式
1:使用<script>标签: 例如上面例子:JavaScript的简单应用 2:外部JS文件: <script type="text/javascript" src="index.js" ></script> 3:直接在HTML标签中: <input name="btn" type="button" value="弹出消息框" οnclick="javascript:alert('欢迎你');"/>
JavaScript核心语法
变量 数据类型 数组 运算符号 控制语句 注释 输入/输出 语法约定
核心语法—变量
先声明变量再赋值 var width; var:用于声明变量的关键字 width = 5; width:变量名同时声明和赋值变量 var name="皮皮"; var x, y, z = 10;注意:JavaScript区分大小写,特别是变量的命名、语句关键字等
核心语法—数据类型
undefined: var width; 变量width没有初始值,将被赋予值undefinednull: 表示一个空值,与undefined值相等number: var iNum=23; //整数 var iNum=23.0; //浮点数boolean: true和falseString: 一组被引号(单或双引号)括起来的文本 var string="This is JavaScript";
核心语法— typeof运算符
typeof: 检测变量的数据类型 typeof运算符的返回值如下: undefined:变量被声明但还未被赋值 String:用单引号或双引号来声明的字符串 boolean:true或false number:整数或浮点数 object:javascript中的对象、数组和null
核心语法—String对象
属性: 字符串对象.length方法: 字符串对象.方法名();String对象方法如下表:
方法名称 | 说 明 |
---|---|
charAt(index) | 返回在指定位置的字符 |
indexOf(str) | 查找指定字符串在原字符串中首次出现的位置 |
substring(index1,index2) | 返回位于指定索引 index1和index2之间的字符串(包括index1但不包括index2对应的字符) |
split(str) | 将字符串分割为字符串数组 |
核心语法—数组
创建数组: var 数组名称 = new Array(length);注意: new:数组的关键字 length:表示数组中可存放的元素总数 数组名[下标]来访问数组元素 数组的常用属性和方法下表:
类别 | 名称 | 描 述 |
---|---|---|
属性 | length | 设置或返回数组中元素的个数 |
方法 | join( ) | 把数组的所有元素组合为一个字符串,通过一个分隔符进行分隔 |
方法 | sort() | 对数组排序 |
方法 | push() | 向数组末尾添加一个或多个元素,并返回新的长度 |
核心语法—运算符号
类型 | 运算符 |
---|---|
算术运算符 | + - * / % ++ — |
赋值运算符 | = += -= |
比较运算符 | > < >= <= == != === !== |
逻辑运算符 | && || ! |
===与==的区别: 1、==(等于):只比较表面值,如“2”和2 相等 2、===(绝对等于):同时比较表面值和数据类型,所以“2”和2不相等;