day01-js笔记
1. 在html页面引入js的三种方式
使用内联式,这里涉及到的基础概念有事件句柄。js是一门事件驱动型语言,依靠事件驱动,然后执行对应的程序。
事件句柄:任何事件都会对应一个事件句柄。事件和事件句柄的区别是:事件句柄需要在事件单词的前面加一个“on”。事件句柄在html标签中以属性的形式存在。在事件句柄属性的值里面可以写js代码,当事件触发时,事件句柄里的代码就会执行了。内联式就是直接在html标签中写js代码。
<input type="button" value="欢迎js" onclick="window.alert('123')" />
使用代码块样式
这里的使用方式如同css是一样的,在html代码中插入js脚本码块。不同的是js代码块的位置是随意的,css的代码块必须放在head标签里。
<script type="text/javascript"> window.alert("欢迎访问") </script>
使用外部链接的形式
对比css进行学习。单独创建一个后缀为".js"的文件,在该文件里可以直接写js代码。然后在需要调用的html文件中进行调用,调用代码在html文件中的位置也是随意的。(不能改写成:
<script />
,这种是错误写法。)- 与css引入外部链接不同的是,js写文件路径用的是
src="文件路径"
css写文件路径用的是href="文件路径"
- 同时注意超链接的使用也是
<a href="https://baidu.com">
- 图片标签的使用是
<img src="images/001.jpg">
。 - form表单中使用的是
<form action = "http://192.168.0.1:3380/oa/save?" method = "post">
<script type="text/javascript" src="js/001.js"></script>
- 与css引入外部链接不同的是,js写文件路径用的是
2. 变量
变量的声明与赋值
js属于弱类型编程语言,它的一个变量可以接受任何类型的数据。
变量的声明:
var a;
。js中的分号可以添加,也可以省略。该变量声明的时候未赋值,系统默认赋值:undefined
。变量的赋值:
a = 3.14;
,因为是弱类型编程语言,所以可以对其赋任何类型的值,它都可以接收。js中变量的数据类型(六种)
- 原始类型:Undefined Null Number String Boolean
- 引用类型:Object
ES6之后新添加了一种数据类型:Symbol
Undefined类型
Undefined类型只有一个值就是
undefined
。变量声明但没有赋值的时候,系统默认给变量赋值undefined。Null类型
该类型只有一个值,
null
。typeof运算后的结果是“object”
Boolean类型
该类型只有两个值,
true
和false
。Js中if语句和while语句的括号里会自动调用
Boolean()
函数,将不是Boolean类型的值转换为Boolean类型。转换规律是:“有”则转换为true,“无”则转换为false。Number类型
该类型的值包括有:整数和小数,还有两个特殊的,NaN(不是一个数字),Infinity(无穷大)。
NaN(Not a Number),属于Number类型,运算结果本来是一个数字,但是算完之后不是一个数字,此时结果为:
NaN
关于Number类型有几个常用的函数。
isNaN()
,当运算结果不是一个数字的话返回true,是一个数字的话返回false。parseInt()
,将字符串转换为数字,并取整数位。如果传入的参数是一个Numer类型的小数,也可以进行取整数位。parseFloat
,将字符串转换为数字。Math.ceil()
,向上取整。
String类型
Js中的字符串包括小String和大String两种。小String属于原始类型,大String是Js的内置对象,属于Object类型。
在Js中,字符串可以使用单引号,也可以使用双引号。
小String和大String的属性和函数是通用的。
常用属性:length,返回字符串的长度。
大小String的定义如下:通过new对象方式创建出的是大String
var s1 = "hello js";//创建小String var s2 = new String("nice to meet you");//创建大String alert(typeof s1); //"string" alert(typeof s2); //"object"
关于String的一些函数:着重记忆这两个函数,会区分
substr(startIndex, length)
,开始索引,截取长度substring(startIndex. endIndex)
,[开始索引,结束索引),左闭右开。
两个函数都是截取字符串的函数,不同的是函数的参数的意义不同。
var s3 = "abcdefghijklmn"; alert(s3.substr(3,5)); //de alert(s3.substring(3,5));//defgh
Object类型
- Object类型时所有类型的超类。