一.变量和常量: 1.变量是可以改变的:var 变量名=值: 2.常量是不可以改变的:var 常量名=值; 二.数据类型 1.原始/基础/值类型:5个 Number,String,BOOlean,undefined,null 2.引用类型:11个,现在学的是Array 三.算数运算符:+-/% 特殊:+运算,如果碰到一个字符串,那么两边的数据会悄悄转换为字符串,+运算变为拼接操作. 拓展:1.用户输入框:var user =prompt("提示文字"); 2.产看数据类型:typeof(变量/值/表达式); 3.页面上获取数据的类型都是字符串; 4.分支:作用是判断 四.数据类型的转换: 1.隐式转换: 算数运算符具有隐式转换,默认转为数字 特殊:1.+运算,碰上字符串,则为拼接 2.-/%字符串也会转为数字,必须是纯数字组成的字符,如果包含了非数字字符则为NaN; 3.NaN参与算数运算结果都为NaN,参与比较运算结果都为false,判断是不是NaN:!isNaN(x); 2.显示/强制转换: 1.xx.toString(); undefiened和null不支持 2.parselnt(str/num/)parseFloat(str)/Number(x) 五.函数:是提前预定好,反复执行的代码 1.创建: function 函数名(形参,...){ 函数体 } 2.调用函数: 函数名(); 3.绑定事件:函数名.onclick=function(){ 函数名(); } 六.分支: 1.三种结构: ①:顺序结构:默认结构,从上往下依次执行每一句代码 ②:分支结构:根据判断条件,选择一部分代码去执行(只会走一条路) ③:循环结构:根据判断条件,选择是否重复执行某一段代码 2.if结构: ①:一个条件一件事,满足就做,不满足就不做 if(判断条件){ 操作 } ②:一个条件两件事,满足就做第一件,不满足就做第二件 if(判断条件){ 操作1 }else{ 默认操作 } ③:多个条件多件事,满足谁就做谁 if(判断条件){ 操作1 }else if{ 操作2 }else if{ 操作3 }else{ 默认操作 } 注意:1.最后的else是可以省略的,但如果条件都不满足,则分支白写 2.条件有属河北写的顺序需要注意,因为分支只会走一条路 拓展:逻辑运算符: &&:并且(与) 只有全部条件为true,最后结果才为true 主要有一个条件为false,最后结果就为false ||:或 只有全部条件都为false,最后结果才为false 只要有一个条件为true,最后结果为true !:颠倒布尔值: !true->false !false->true 七.循环结构:反复执行的代码,几乎在一瞬间执行完毕 1.语法:var 循环变量=变量值; while (循环条件){ 循环体; 循环变量变化一下; } 2.执行原理:先判断循环条件,如果条件为真,则执行一次循环体, 然后再判断循环条件,如果条件为真,则执行下一次循环体, 重复次循环.直至条件为假,循环才会结束 注意:循环是一次一次的执行,并不是同时执行 3.死循环:永远不会结束的循环,保存的死循环也可以退出循环 何时结束:不确定要执行的具体次数,往往是循环会搭配break进行退出 while(true){ 循环体 } break;(退出循环) 八.数组: 1.创建数组: ①:直接量方式: var arr=[]; (空数组) var arr=[数据,数据,..] ②:构造函数方式: var arr=new Array(); (空数组) var arr=new Array(数据,数据,..); 2.访问数组: ①:获取数据: 数组名[下标]; 特殊:下标越界,获取到的是一个undefined ②:添加数据: 数组名[下标]=新数据; 特殊:1.如果下标处已有元素,则为替换 2.如果下标越界,会导致数组变成一个稀疏数组,中间会出现很多undefined,并且下标也不在连续 ③:数组的三大不限制: 1.不限制元素的长度 2.不限制元素的类型 3.不限制下标越界,但这个操作不是好事情 3.数组对象-唯一属性 ①:语法:数组名.length -获取到数组的长度 ②:三个固定套路: 1.向末尾添加元素:arr[arr.length]=新值; 2.获取倒数第n个元素:arr[arr.length-n]; 3.删除末尾的n个元素:arr.length-=n; 4.遍历数组:将数组的每个元素都取出来执行相同或相似的操作 公式:for(var i=0;i<arr.length;i++){ arr[i]; 当前获取到的元素 } 九.DOM树:把HTML看做是一个树状结构,树根是document对象(属性和方法),不需要创建,直接使用 1.获取元素:标签/class名:var elems=document/已经找到的父元素.getElementsByTag/ClassName("标签/class名") 特殊:①:返回的是一个类数组集合,可用下标,length,遍历,不能直接做操作 ②:没找到的返回的是空集合 ③:不一定非要从树根进行查找 通过节点之间的关系:前提:至少找到一个人 父元素:xx.parentNode; 子元素:xx.children; 第一个儿子:xx.firstElementChild; 最后一个儿子:xx.lastElementChild; 前一个兄弟:xx.previousElementSibling; 后一个兄弟:xx.nextElementSibling; 2.操作元素: ①:内容:innerHTML(双标签:识别标签)/innerText(双标签:纯文本)/value(input) 获取:elem.内容属性; 设置:elem.内容属性="新内容" ②:属性: 获取:elem.getAttribute("属性名"); 设置:elem.setAttribute("属性名","属性值"); 简写: elem.属性名 elem.属性名="属性值" 3.样式: 内联样式: 获取：elem.style.css属性名; - 只能获取到内联样式 设置：elem.style.css属性名="css属性值" 注意：css属性名有横线的地方都去掉横线，变为小驼峰命名法 4.绑定元素: 元素： 单个元素：xx.onclick=function(){ this->xx } 集合： for(var i=0;i<elems.length;i++){ elems[i].onclick=function(){ this->当前元素 } }
