Bootstrap

JavaScript语法

1.1引入js

方式一:

<Script> 在HTML内部使用

在该标签中放入我的JS代码

</Script>

方式二:<Script src="文件名.js"></Script>

1.2

基本语法:

<Script>

//1.定义变量 变量类型 变量名=变量值

Var num=1;

alert(num);//使用弹窗将num的值显示出来

//2.条件控制

var score =1;

if(score>60&&score<70){

alert("提示信息");

}else if(score>70&&score<80){

alert("提示信息");

}else{

alert("提示信息");

}

console.log(score); // 在浏览器控制台打印变量

1.3

比较运算符:

= 赋值

== 等于(值同类型不同true)

=== 绝对等于(类同,值也相同)

须知NAN这个与所有的数值都不相等,只能通过is NAN(NAN)来判断是否是NAN

浮点数:尽量避免使用浮点数运算,存在精度问题

null和undefined区别

1.null是空

2.undefind是未经定义

数组:JS中不需要类型相同:

例:var arr=[1,2,3,4,"sjdjhs",null,ture];

数组下标越界是undefined

对象:对象是大括号,数组是中括号,每个属性之间用逗号隔开,最后一个不需要加逗号

var person={

name:“sjdksj”,

age:30,

tags:['k','d','y',.....]

}

在控制台使用person.name则可显示属性值

}

严格检查模式:在使用这个模式下的JS语句将会有严格的要求

2.数据类型

2.1字符串:

1.正常字符串使用,单引号,或者双引号包裹。

2.注意转义字符\

3.多行字符串编写

// tab键上面,esc键下面

var msg=`hellow worlds 你好

世界`;

4.模板字符串

// tab键上面,esc键下面

let name="qing";

let msg=`你好呀,${name}`;

输出结果:你好呀,qing

5.字符串的长度

字符串名.length

6.字符串是不可变的

7.大小写转换

 字符串名.toUppercase(); 转成大写

字符串名.toLowercase();转成小写

8.字符串名.indexof('t');   找指定字符在字符串中的位置

9.字符串名.substring(1); 从第一个位置截取到最后一个位置

  字符串名.substring(1,3);    //范围是[1,3)

2.2数组

Array 可以包含任意的数据类型

var arr=[1,2,3,4,5,6]       //可以通过下标取值和赋值

1.长度

arr.length           

注:加入给arr.length赋值,数组大小会改变,如果赋值过小,元素就会丢失

arr.length=10;

2.indexof(),寻找指定元素在数组中的下标索引

数组名.index();

字符串“1”和数字1是不同的

3.slice() 截取Array的一部分,返回一个新的数组类似于substriing();

4.push,pop(尾)

数组名.push(‘   ’,'  ');  压入数组

数组名.pop  弹出一个尾部元素

5.unshift()  //压入到头部

shift()       //弹出头部的一个元素

6.sort()    //排序方法

7.reverse()   //元素反转

8.concat()   //连接函数,并没有改变原来数组,而是重新生成一个数组

9.join()      //连接符

10.多维数组

2.3对象

若干键值对,注意:最后一个属性值不用写逗号

var  对象名={

属性名:属性值,

属性名:属性值,

属性名:属性值

                          }

JS中对象,{.....}表示一个对象,键值对描述的是属性,多个属性之间使用逗号隔开

1.对象赋值

对象名.属性值="值"

2.使用一个不存在对象属性,不会报错!

对象名.不存在的属性名           提示ubdefind

3.动态的删减属性,通过delete删除对象的属性:delete  对象名.属性名;

4.动态的添加属性,直接给新的属性添加值即可:对象名.添加的属性名=“值”

5.判断对象中是否存在在这个对象中!xxx(属性名)  in xxx(对象名)

6.判断一个属性是否是这个对象自身所拥有的,hasownperpety()

用方法:对象名.hasownperpety('属性名')

2.4流程控制(与java中的流程基本相同)

1.if-else:if(判断条件){    条件为真时执行的语句      }else{ 条件为假的时候执行的语句 }

2.循环:要避免程序死循环

(1)while( 循环判断条件 ){       }

(2)do{        }where(循环判断条件)

  (3) for( 循环变量) {    }

3.数组循环:

(1)forearch循环

        数组名.forearch(  function(value) {

console.log(value);

})

(2)for(var num(注该变量是索引)  in  数组 ){

}

3.5map和set

(1)Map:var map =new Map( [ [‘tom’,100],['jk',200],['lh',600] ] );

var name=map.get('tom');  //通过key获得值

添加操作:map.set(键,值);

(2)Set:var set =new set( [ 3,1,1,1,] );      //会将重复的自动去除

set.add(2); //添加操作,若set集合中该元素并不存在,则将添加成功

set.delete(1);  //从集合中删除指定元素

set.has(3);  //判断集合中是否包含该元素

3.6使用iterator进行遍历

for(var  x  of  数组(包括map和set)){   }   //x代表的是元素,及是元素遍历

4.函数

绝对值函数   function abs( 可传入参数) {          }

匿名函数   var abs=function(可以传入参数){    }

5.面向对象编程

js中,拥有类似于java中的对象的概念,不过在js中操作的是每个节点;

5.1操作BOM对象(浏览器)

5.2操作DOM对象(核心)

浏览器网页就是一个Dom树型结果

操作有:

1.更新:更新Dom对象   2.遍历:得到DOM节点    3.删除DOM对象  4.添加:添加一个新的节点

要操作就要先获取dom节点

获取操作:

document.getelementsBytagname("标签名");   //获得该类标签对象组

document.getelementByid("id名");  //通过id名来获得具体的节点

document.getelementByclassName("名字");       

;