一、JavaScript基础1.变量:区分大小写(html不区分大小写)变量和作用域:1)Js在函数内部直接读取全局变量2)在函数外部无法读取函数内部的局部变量3)在函数内部声明变量的时候,要使用var,如果不用,则认为声明的是全局变量2.标识符的命名:第一个字符必须是字母、下划线或$第二个字符及以后:字母、数字、下划线或¥3.保留字(不可以当做标识符):4.声明变量:1)声明变量:vara;2)赋值:a=10;3)声明变量和初始化变量:vara=10;4)声明多个变量:varx,y,z=10;5)不声明变量,直接使用:x=105.数据类型:1)Typeof操作符:用来检测变量的数据类型:a)Undefined:未定义b)Boolean:布尔型c)String:字符串d)Number:数值e)Object:对象/nullf)Function:函数g)例如:Varsun=“太阳”;Alert(typeofsun);2)Undefined类型:定义了一个变量但是没有给这个变量赋值、使用一个为定义的量、或者用了一个不存在的对象的属性的时候,返回undefined3)Null类型:空字符,表示不存在的值a)如果定义的变量准备在将来用于保存对象,那么最好将该变量初始化为null。b)养成编码的规范,不要忘记初始化变量。4)Boolean类型:true/false(小写)a)Varhello=“helloworld”;alert(typeofhello)//返回的是string类型b)Varhello=Boolean(helloworld;alert(typeofhello)//返回的是boolean类型c)If语句:Varhello=“helloworld”if(hello){alert(“如果条件为true,就执行这条语句”);}else{alert(“如果条件为false,就执行这条语句”);}d)5)Number类型:数字型a)整数或者实数,所有的数字都以浮点型来表示,如:vara=474;varb=54.23;b)判定是否超过数字型的范围:isfinite()函数,如果没有超过,返回true,超过了返回false。varbox=10e1000;alert(isFinite(box));//返回falsec)处理整数:parseInt()函数6)String类型:表示由零或多个16位Unicode字符组成的字符序列,即字符串。a)字符串可以由双引号(“”)或单引号(‘’)表示。b)Tostring()函数:把值换成字符串7)Object类型:一组数据和功能的集合a)Varbox=newobject();b)Object里可以任意传参,可以传数值、字符串、布尔值等。而且,还可以进行相应的计算。6.转义序列:a)\n:换行b)\t:制表c)\b:空格d)\r:回车e)\f:换页f)\\:斜杠7.运算符:8.数组:1)Push():追加数组数据2)Pop():删除数组最后一个数据3)Shift():移除数组第一个数据4)Unshift():把数据移到数组的第一位9.实例属性和类属性:实例属性:在函数中用this前缀修饰的变量,要通过对象来访问类属性:在函数中以函数名前缀修饰的变量,类属性是整个类的,可以通过类(函数)来访问。局部变量:只能在函数里面访问10.函数:1)函数的声明:a)无参函数:functionbox(){Alert(‘只有函数被调用,我才会被执行’)}调用函数:box();b)有参函数:functionbox(name,age){Alert(‘你的名字’+name+‘年龄’+age)}调用函数并且传参数:box(‘爆米花’,12);c)定义函数的三种方式:定义命名函数定义匿名函数使用function类匿名函数vars=newFunction(‘nume’,document.write(‘Function定义的函数’+document.write(“你好”+name))+)2)递归函数:3)Return返回值:4)Arguments对象:a)是所在函数的一个内置类数组对象,可以用数组的[i]和.length。b)Sdc)重载:就是根据参数选择相同函数名而参数不同的函数11.调用函数的三种方式1)直接调用函数2)以call()方法调用函数:需要动态传入一个函数引用(动态的调用函数)函数的引用.call(调用者,参数1,参数2)3)以apply()方法调用函数4)Apply()和call()的区别:Call()调用的时候,必须在括号内详细的列出每个参数Apply()动态调用的时候,可以在括号中用arguments来代表所有参数12.对象的创建1)使用new关键字调用构造器创建对象2)使用object直接创建对象Js的对象都是object类的子类3)使用json创建对象二、语句1.Foreach循环:for(var变量名in数组名){}2.For循环:for(var变量名;范围;变量++/--){}3.If语句4.While语句5.Dowhile语句6.Switch语句7.Break:跳出整个循环(当前所在的循环)Continue:结束本次循环,进行下一次循环跳出外层循环:设置标签,如图三、DOM(documentobjectmodel)文档对象模型1.DOMHTML1)改变HTML内容:Document.getElementById(id).innerHTML=newhtml;id.innerHTML=新内容或者:2)改变HTML属性Document.getEelementId(id).attribute=newvalue;id.属性=新的属性值2.DOMCSSDocument.getEelementId(id).style.property=newstyle;id.style.属性=新的属性值3.DOM事件1)Onclick事件:在html元素上点击执行function;2)Ondblclick时间:双击触发3)Onload事件/onunload事件共同点:在用户进入或者离开页面的时候被触发;用于处理cookie不同点:onload检测发访问者的浏览器类型和版本,加载网页的正确版本4)Onchange事件:对输入的字段进行验证5)Onmouseover/onmouseout事件:鼠标放在元素上面/移动的时候触发函数类似伪元素选择器:hover,不同在于这个触发函数6)Onmousedown/onmouseup事件:点击按钮的时候触发事件1,松开鼠标后,触发事件2,最后结束的时候,类似事件onclick。7)Onfocus事件:获得焦点8)Onblur时间:失去焦点9)Onkeydown/onkeypress/onkeyup:按下键盘某个键的时候触发/单机键盘某个键/松开键盘某个键10)Onreset:重置表单的时候触发Onsubmit:提交11)Onsize:改变窗口大小4.DOM节点1)添加节点:第一步:创建一个新的元素类型:createElement();第二步:在创建一个元素节点第三步:在元素的后面追加这个节点在已有的元素里面追加这个新的元素第四步:定义原有对象的元素名称第五步:向已有的元素后面追加新的元素2)删除节点:第一步:获取父元素id第二步:获取将要删除元素的id第三步:从父元素中删除子元素3)修改html元素a)innerHTML:div/span/td内容的呈现b)value:textarea内容的呈现c)className:修改HTML的css样式:class选择器名称d)style:修改HTML元素的内联css样式e)options[index]:select指定列表4)复制当前节点:nodecloneNode(booleant/f):复制当前节点。当值为true,表示在复制当前节点的同时,复制该节点的全部及其后代当值为false,表示只复制当前节点5)插入节点:InsertBefore(NodenewNode,NoderefNode):在refNode节点之前插入newNode6)替换节点:replaceChild(NodenewNode,NodeoldNode);7)为列表框和下拉菜单添加选项a)HTMLSelectElement的add方法进行添加选项Add(option,before):在before选项之前添加option选项,before指定为奴的时候可以将option选项添加到最后b)直接为select的执行选项赋值appendChild(option);c)Newoption(text,value,defaultselected,selected)Text:选项的文本Value:选中该选项的值DefaultSelect:默认是否选中选项Selected:该选项当前是否被选中8)动态添加表格内容:a)insertRow(index):在指定索引处插入一行b)createCaption():为表格创建标题c)insertCell(longindex):在指定索引处创建一个单元格9)节点访问HTML元素:a)ParentNode:返回当前节点的父节点b)PreviousSibling:返回当前节点的前一个兄弟节点c)nextSibling:返回当前节点的下一个兄弟节点d)childElementByTagName(tagName):返回当前节点的具有指定标签名的所有子节点e)firstChild:返回当前节点的第一个子节点f)lastChild:返回当前节点的最后一个子节点10)访问表单控件a)Action:表单提交的地址b)Element:返回表单内全部表单控件组成的数组c)Length:个数d)Methode)Target:_self,_blank,_parent,_top:指定提交表单式的结果窗口f)Reset():重置表单g)Submit():提交表单11)访问列表框和下拉菜单的选项:a)Form:返回当前列表框或下拉菜单所在的表单对象b)Length:c)Options:返回所有选项组成的数组d)selectedIndex:返回选中选项的所有e)type:f)index:g)selected:是否被选中h)text:选项呈现的文本i)value:每一个选项的value属性12)访问表格子元素:a)Caption:标题对象b)Tfoot:c)Thead:d)Tbody:e)Table.Rows[index]:返回表格的第index+1行f)Cells:单元格组成的数组g)Rowindex:行索引13)删除列表框和下拉菜单的选项a)Remove(longindex)b)直接将制定的选项赋值为null14)删除表格的行或者单元格15)事件冒泡:当浏览器执行某个动作的时候,页面上有多个元素相应该事件传递方向:从下向上传递事件16)重定向事件:不用按照dom数上溯,希望给在不同节点之间跳跃Target。fireEvent(Stringevent,Eventevent):将事件event事件重定向到target对象headmetacharset=UTF-8title重定向事件/title/headbodyonclick=c('tb元素')tableonclick=c('tr元素')tronclick=c('td元素')tdonclick=c('p元素')ponclick=c('btn元素')inputtype=buttonvalue=点击我onclick=/p/td/tr/tablehrinputtype=buttonid=forwardvalue=被转发的事件onclick=c('被转发的事件按钮')divid=re/divscriptfunctionc(who){//打印写入放入内容document.getElementById(re).innerHTML+=who+被点击了;//取消事件冒泡