1、js输出方式
①控制台输出：consle.log（数字/“字符串”/变量）；
②在页面上输出（支持标签）：document.write（数字/“字符串”/变量）；
③在弹出框输出：alert（数字/“字符串”/变量）
2、变量
1、创建变量：var 变量名=值；
如果创建多个变量，可以省略掉中间var，分号都要换为逗号简写
特殊性：①变量名不是随意的，不能以数字开头②不能使用关键字③要见名知意
注意**：变量名有一个很特殊的name，不管保存的数据是什么，最后都会变成一个字符串
赋值符号：“=”；把=右边的数据保存在=左边的变量名之中，左边就单单纯纯的是一个变量名而已，不会变成变量的值
3、常量
常量：一旦创建，值不可以被修改
语法：const常量名=值；
4、数据类型
Number：数字，取值有无数个 String：字符串，取值有无数个
Boolean：布尔值，取值只有两个。true（真）、false（假）
Undefined：取值只有一个。undefined是变量的默认值，没有任何作用
Null：取值只有一个。可以用null释放内存
5、算术运算符（+、-、*、/、%）
%：取余，俗称摸。m/n不取商，而且除不尽的余数
作用：①判断奇偶性 a%2==0为偶数，a%2==1为奇数
②获取一个数字的后n位 1234%10--4 1234%100--34
③判断一个数字永远不超过几 n%5--结果永远不会超过5
**注意**：算术运算其实具有隐式数据类型转换，默认都会转为数字运算
特殊：+运算中，如果碰到一个字符串，那么两边的数据都会悄悄转换为字符，然后+运算变为拼接操作
-、*、/、%其实字符串也可以转换为数字必须是纯数字组成的字符串才行，只要包含一个费数字字符，结果仍为NaN
6、其他
①用户输入框var user=prompt（“提示文字”，“默认值”）
②查看数据类型：typeof（变量、值、表达式）；
③在页面上的获取到的数据类型都是字符串，如果要转为数字，有三种方法：
*a、parsInt（）
原理：从左到右依次读取每个字符，碰到非数字字符则停止，并且不认识小数点，如果一开始就遇到的就不认识则为NaN。如：parseInt（35.45）；转换出来为35
*b、parseFloat（）；
原理：几乎和parseInt一致，但是认识第一个小数点。他们在转为数字的同时都去掉了单位
c、number（）
任何人都可以转为数字。等同于隐式转换
7、数据类型的转换
1、隐式转换
NaN（not a number）：不是一个数字，但是确是number类型，不是有效数字。它参与任何的算术运算，结果人给NaN;它也参与任何的比较/关系运算，结果都为false，甚至不认识自己。
！NaN（）；用于判断是不是有效数字。结果为true则为有效数字，false是NaN。可用来限制用户输入的必须是一个数字。
2、强制转换
转字符串：xx.toString；undefined和null不支持，不能使用操作
8、函数
1、什么是函数：是一段为预定义好的，可以反复使用的代码，失格独立的功能体，可以将若干个的代码放在里面
2、语法
a、创建函数 function 函数名（）{}
b、调用函数
函数名（）；写几次就调用几次
可以将函数用按钮绑定在页面上，等用户来触发<button onclick=“函数名（）"></button>
3、带参数的函数
a、创建 function 函数名（形参，形参，....）{函数体；}
形参：形式参数，是一个变量，只不过不需要var
b、调用 函数名（实参，实参，...）/实际参数
例： function hs（形参）{函数体}
hs（实参）
注意：①传入实参的顺序一定要和形参的顺序对应上
②函数不一定非要有参数：如果操作是固定的，则不需要传递参数；根据传入的实参不同，做的操作略微不同，则需要添加参数。
9、分支参数
1、程序的结构
a、顺序结构：默认结构，从上向下一次执行每一句代码
b、分支结构：根据判断条件，选择一部分代码去执行（只会走一条路）
c、循环结构：根据判断条件，选择是否重复执行某一段代码
2、比较/关系运算符 >/</>=/<=/==（等于）/!=（不等于）
这几种运算符结果都为布尔值：true、false
往往比较运算符出现在分支、循环的判断条件之中
关系运算符也具有隐式转换
3、if结构
a、一个条件一件事，满足就做，不满足就不做，但是后续代码还是会执行
语法：if（判断条件）{操作；}
b、一个条件两件事，满足就做第一件，不满足就做第二件
语法：if（判断条件）{操作1；}else{默认操作}
c、多个条件多件事，满足谁就做谁
语法：if（判断条件）{操作1；}else if（判断条件）{操作2；}...else{默认操作；}
** 10、逻辑运算符**
1、&&：与（并且）
只有全部条件都为true，最后才为true；只要有一个条件为false，最后结果都为false
2、||：或
只有全部条件都为false，最后结果才为false；只要有一个条件为true，最后结果就位true
3、！：颠倒布尔值
！true→false ！false→true
11、循环结构
什么是循环：反腐之星相同或相似的操作
循环三要素：①循环条件：开始、结束：循环执行的次数
②循环体：循环的操作：要干什么
③循环变量，切变量需要不断的变化
1、while循环
var 循环变量=几；
while（循环条件）{循环体
循环变量变化一下；}
执行原理：先判断循环条件，如果条件为真，则执行一次循环体，然后再判断循环条件；如果条件为真，则执行再一次循环体.....知道条件为false，循环才会结束
循环是一次一次执行的，并不是同时执行的
死循环：永远不会结束的循环。保存死循环也是可以退出循环的。搭配break退出
使用：不确定要小hiing的具体次数，但往往死循环会搭配上break进行退出。
死循环语法：while（true）{循环体}
2、for循环
语法：for（var 循环变量=几；循环套件；变量的变化）{循环体}
特殊：①死循环for（；；）{循环体}-两个分号一个不能少
②循环变量处其实可以创建多个变量
③也支持break
3、总：a：while循环一般用于不确定循环次数时候，当做死循环，依据判断条件搭配break使用
b：for循环常用于确定循环次数时使用
12、数组
1、数组：多个数据/元素组成的一个集合，保存一个变量中
数组中的元素都是按照线性顺序来排列，除了第一个元素，每个元素都有一个唯一的前驱元素；除了最后一个元素，每个都有一个唯一的后继元素
**数组中每个元素都有一个唯一的位置序号，称之为“下标”，用来表示数组中的每一个原色下标是从0开始，最大为（长度-1）
2、创建数组
方式一、直接量方式
var arr=[];空数组
var arr=[数据，数据，...];
方式二、构造函数方式
var arr=new Array[]；空数组
var arr=new Array[数据，数据，...]；空数组
3、访问数组
a、获取数组
数组名[下标]；
注意：下标越界，获取到的是一个undefine
b、添加数组
数组名[下标]=新数据；
注意：① 如果下标处已有元素，则为替换
②如果下标越界，会导致数组变成一个稀疏数组，中间就会出现很多的undefine，而且下标也不在连续
数组的三大不限制：
a、不限制元素的长度b、不限制元素的类型c、不限制下标越界（不推荐越界）
4、数组对象-属性
语法：数组名.length-获取到数组的长度
向末尾添加元素：arr[arr.length]=数值
获取倒数第n个元素：arr[arr.length-n];
删除末尾的n个元素：arr。length-=n；
5、遍历数组（将数组中的每个元素都取出来执行相同或相似的操作）
语法： for（var i=0；i<arr.length;i++）{arr[i]；/当前次获取到的元素}
13、JavaScript组成的三部分
1、ECMAScript
2、DOM-Document Object Model：文档 对象 模型-操作为文档（html）
3、BOM-Brower Object Model：浏览器 对象 模型-操作浏览器
14、DOM概念
DOM树：把html看做了是一个倒挂的树状结构，但是树根并不是HTML，而是document对象。document对象不需要创建，由浏览器的js解释器自动创建，一个页面只有一个document
注意：DOM会把页面上的所有的元素都看做是一个DOM对象，DOM节点、DOM元素都是同一个意思
15、获取元素
A、通过HTML的属性去获取元素
1、通过ID名获取元素
语法：var elem=document.getElementByld（“id值”）
返回：是一个DOM对象/DOM节点/DOM元素才可以直接做操作
注意：①如果id重复了，只会返回第一个
②如果没有找到，返回的是一个null
③此方法基本不用
2、通过标签名和class名获取元素
通过标签名
语法：var elems=document（或者父元素）.getElementsByTagNames（“标签名”）
通过class名
语法：var elems=document（或者父元素）.getElementsByClassNames（“class名”）
返回：是一个DOM集合，是一个类数组对象，类似数组，可以用下标、length、遍历
注意：①一个DOM集合是不允许直接做操作的，除非加下标的到某一个或遍历得到所有人，才能做操作
②如果没有找到，返回的是一个控股集合
③此方法不一定要写document，也可以写父元素。如果写的是document，则会找到页面上所有的标签，而写的是父元素，只会找到父元素下面的所有的标签
A、通过节点之间的关系获取元素
前提：至少先要找到一个元素，才能找关系
父元素：xx.ParentNode（找到的是单个元素）
子元素：xx.children（找到的是一个集合）
第一个儿子：xx.firstElementChild（找到的是单个元素）
最后一个儿子：xx.lastElementChild（找到的是单个元素）
前一个兄弟元素：xx.previousElmentSibling（找到的是单个元素）
后一个兄弟元素：xx.nextElementSibling（找到的是单个元素）
16、操作元素
1、内容
a、innerHTML：能够识别标签，用于操作双标签
获取：elem（为标签名）innerHTML；
设置/修改：elem.innerHTML=“新内容”；
b、innerText：用于操作双标签，不能识别标签
获取：elem.innerText；
设置/修改：elem.innerText=“新内容”
c、value：用于操作input标签
获取：elem.value；
设置/修改：elem.value=“新内容”
2、属性
获取属性值：elem.getAttribute（“属性名”；）
设置属性值：elem.SetAttribute（“属性名”，“属性值”；）
简化版：
获取属性值：elem.属性名；
设置属性值：elem.属性名=“属性值”；
简化版的缺点：①class必须写为className②只能操作标准属性，不能操作自定义属性
3、样式
内联样式：
优点：①优先级最高，保证js用户触发一定会生效
②不会牵动所有，只会操作当前元素
缺点：获取样式时，一定要保证此样式在内联样式中
获取样式：elem.style.css属性名；
设置样式：elem.style.css属性名=“css属性值”；
注意：caa属性名的写法中，如果有“-”要去掉，换成小驼峰命名法
例如：原来css中为background-color；在js中应写为：backgroundClor
4、绑定事件
语法：标签名.onclick=function（）{点击后要执行什么代码}
5、this关键字
单个元素绑定事件，this表示这一元素
多个元素绑定事件，this表示当前触发的元素
17、脱掉字符串的衣服
语法：eval(str);
例：eval("3*3");（脱掉衣服后为3*3，自动进行乘法运算，输出结果则为9）
eval("[1,2,3,4]");
