js笔记总结

Js总结1.校验用户输入表单内容2.动态添加网页内容3.为静态网页添加动态效果网页中插入Javascript脚本的方法：1.行内buttononclick=”alert(‘行内JS’)”按钮button2.内部：写一对script标签放到你要写的ＪＳ代码标签后面，一般在页面的最底部script//js代码/scriput3.外链写在headscriptsrc=”js文件路径”/headJs常用驼峰命名法Javascript语言基础1.变量2.运算符3.数据类型4.控制语句5.函数JavaScript语言变量1.用“var”关键词来定义变量，而且将其初始化为任何值a)var定义一个变量，没有赋值，这个变量会有一个默认值：undefined；b)最后一次赋值会覆盖前一次赋值，（重写）；c)变量使用原则：一定先声明，后调用2.变量的储存值可以改变变量名命名规范1.首字符必须是字母，下划线，或美元$2.余下字母可以是数字，字母，下划线或美元符号；3.变量名不能是关键字和保留字4.变量名区分大小写5.变量名中不能右空格，回车或其他字符6.驼峰命名法JavaScript算术算符a++------------------a=a+1;a--;--------------a=a-1;逻辑运算符&&与……||或……！非++=++-=-++=+-=+赋值运算符a+=2…………a=a+2a-=2…………a=a-2a*=2…………a=a*2a/=2…………a=a/2赋值就是吧右侧表达式付给变量1.只要+一侧操作数为字符串数据，则执行链接运算2.链接后的结果为字符串形数据3.字符串一般之和字符串和数字进行链接4.字符串和数字进行链接，数字会被同化为字符串，返回一个新的字符串JavaScript的数据类型1.字符串型：string2.数值型：number3.布尔型：boolean4.函数型：function5.未定义：undefined6.对象：object字符串常见的属性和方法1.length属性：返回字符串的长度（字符的个数）2.charAt()方法：返回制定的字符；3.indexOf（）方法：返回某个制定字符在另一个字符首次出现的位置；4.Substr(开始下标，字符长度)5.Substring（）6.replace()查找字符并替换7.tolowerCase()方法，将字符串串变成小写8.toUpperCase()方法：将字符串变成大写9.toString()方法：将其他类型的数据转化成字符串类型数值型（number）1.parseInt(“数据”)：转化为整形数值（无小数）2.parseFloat(“数据”)：转化为浮点型（有小数）3.用引号包裹后的number，变成字符类型数据；布尔型（boolean）1.取值只有两个：ture和false2.布尔型bollean不能用引号包裹监测：数值类型的方法typeof();Document对象：Js获取页面元素的方法document.getElementById(“标签ID名”)；事件单机：onclick双击：ondblclick鼠标移入：onmouseenter鼠标离开：onmouseleave事件源.事件类型=执行指令Btn.onmouseenter=function(){//执行指令}二，js数组数组：按照编号有规律的存放多个数值。@1.js定义数组的方法vararr=newArray(“zhao”,”qian”,”sun”,”li”,1,2,3);Vararr=[“zhao”,”qian”,”sun”,”li”,1,2,3]@2.js数组访问的方法+常用属性数组名[下标]1.length属性：返回数组长度（数组里面值的个数）arr.length();2.concat方法：在数组中添加新的元素，或将多个数组链接起来构成新的数组3.Join方法：将数组内容链接起来，返回一个字符串4.pop()方法：删除并返回数组的最后一个元素5.push()方法：向数组末尾添加一个或多个元素，并返回新的长度arr.push(你要添加的元素，一个或多个)6.shift()删除并返回数组的第一元素7.unshift（）方法：向数组开头添加一个或多个元素JavaScrpit控制语句条件语句if语句switch语句循环语句：for循环while循环forin循环do循环#1.if条件语句1.单条件格式1：if（条件）语句块；//条件为真是执行语句块，为假时不执行格式2：if（条件）{语句块；}2.双条件If（条件）{语句块1//真是执行}else{语句块2//假时执行}3.多条件if（条件1）{语句块1//真是执行}elseif（条件2）{语句块2//}elseif（条件3）{语句块3//}……else{语句块n//前面的条件都不成立，执行最后一段代码}#2.switch条件语句switch(表达式){case值1：语句1；break;case值2:语句2；break;case值3：语句3：break;default:语句n//default:表达式不匹配任何case值是执行的操作}#3.for循环语句for（vari=0;i4;i++）{//循环语句}#4.while循环do……while循环vari=1;while（i5）{//代码内容i++；}vari=0;do{//代码内容i++}while(i3)#5.通过标签名来获取元素document.getElementsByTagName(‘div’);注意：（1）该函数返回值是一个集合（数组），js允许集体操纵集合，只允许单个访问（arr[下标]）（2）改集合下标是从0开始的（3）只有一个元素的数组，也不能集体操纵#6.函数1.函数的基本结构：function函数名（参数）{代码块}2.函数四要素A.Function:告诉浏览器，在内存中开辟内存区域，封装功能；B.函数名：给功能定义一个名称；C.参数集：就是一个圆括号，里面可以存放0-N个变量；D.函数体：花括号里面的功能3.基本特征-不会主动执行需要调用-------调用方法函数名();4.无参函数有参函数（调用时可以导入参数）5.间接调用（在html里面调用）buttononclick=”show(‘kitty’)”6.匿名函数没有函数名的函数匿名函数的自我调用（function（）{//函数块}）（）；用一个变量名存储匿名函数变量名+（）实现调用7.函数中return的作用：A.在函数中右return的情况下，执行了return之后，会当前调用函数的人返回一个结果信息，这个信息结果可以被变量接受，这种函数叫做有返回值函数；B.一旦函数执行过程中执行了return语句，则函数立即终止，不在向下执行其他代码；8.函数的变量作用域问题1.局部变量：在函数内的变量，在函数外面访问不到2.全局变量：在函数未免声明的变量，在函数内部可以访问到；Js改变thml标签的属性使用方法：页面元素.标签属性=“值”varbox=document.getElementById(“box”);box.style.width=”399px”Box.src=urls[d0d0d]属性标签特例className如果一个页面元素已有一个类名，想追加一个或多个，需要吧之前的类名也写上，新旧类名之间用空格隔开，如果要清空类名，直接写：页面元素.className=””;Js改变html标签的内容：使用方法：页面元素.innerHTML=值；实现过程：在页面元素内部，插入HTML内容=后面的标签浏览器，会被解析出来；box[0].innerHTML=123;Box[1].innerHTML=’ahref=”#”链接a’Js的入口函数直接在head内获取页面元素是获取不到的，通过入口函数可以解决这一问题；入口函数：window.onload=function(){//js块}Js数学对象1.Math.PI:返回圆周率；2.Math.abs(x):返回数的绝对值3.Math.ceil(x):向上取舍4.Math.floor(x):向下取舍5.Math.max(a,s,d,f,g,h):返回他们的最大值；6.Math.min(a,s,d,f,g,h):返回他们的最小值；7.Math.round(x):四舍五入；8.Math.random():返回0-1之间的随机数日期对象：1.vartoday=newDate();返回当前日期和时间2.today.getFullYear();返回当前年份3.today.getMonth();返回当前的月份-1；4.today.getDate();返回一个月中的某天5.today.getDay();返回星期数6.today.getHours()返回小时数7.today.getMinutes();返回分钟数8.today.getSeconds();返回秒数；9.today.getTime();返回1970/1/1到今天的毫秒数10.today.toLocaleString返回中文格式（2016/9/30上午9：31:02）事件日期；定时器1.单次定时器格式：setTimeout(匿名函数整体或自定义函数名，等待时长)；（1）等待时长是毫秒（2）等待额定毫秒之后，会将前面函数内部的代码从头到尾执行一次，有且只能执行一次；2.循环定时器setInterval(匿名函数整体或自定义函数名，间隔时长)；间隔时长是毫秒，没隔多少毫秒，就执行一次前面函数内部的代码，该代码执行无数次3.停止定时器（1）先设置一个全局变量：timer（2）在相应的位置拿timer去储存定时器（3）使用clearTtimeout清除单次定时器，使用clearInterval清除循环定时器（4）事件=function(){定时器变量名=setInterval(function(){设置内荣},时间);}4.定时器累加解除开启新定时器之前，先将旧定时器做一次清空DOMDocumentObjectModel(文档对象模型)DOM的本质是建立了HTML元素与脚本语言沟通的桥梁，JS中绝大部分操作都是脚本和网页里面不同的HTML元素之间的交互一段HTML代码实际上对应一颗DOM树，每个HTML元素就是DOM树中的一个节点；通过HTML的模型可以获取并操纵DOM树中的节点；追加元素类名obj.className+=新类名box[0].className+='ds';去掉元素某一个类名obj.className=obj.className.replace(‘’要去掉的类名’’，“”)box[0].className=box[0].className.replace(box1,);替换某一个类名将box1替换成BOXbox[0].className=box[0].className.replace(box1,BOX);2.获得节点内容：box.innerHTML获取box内所有标签box.style.width获取box的width度3.设置节点内容：box.innerHTML=’123456’htmlbodypid=p1HelloWorld!/pscriptdocument.getElementById(p1).innerHTML=Newtext!;/script/body/html注意：只有双标签才有innerHTML属性;4创建节点：1.创建HTML元素（标签）：createElement(‘’)方法，创建之后注意添加。创建成功后需要box.appendChild(“document.create(‘p’)”)也可一将创建元素储存到变量声明（vartag=document.create(‘p’)之中box.appendChild(“tag”)在box内添加html标签P）2.创建文本：creatTextNode(‘’)方法；3.appendChild():新增子节点，将他