1、JS笔记第一章基础语法 31在页面中使用js代码 3(1)直接使用:标签中插入 3(2)在html中任意位置声明写入 3(3)导入js文件 32语法规则 43.常量 44. 变量 45.命名规则: 46.注释: 57.数据类型 5(1)值类型: 5(2)引用类型 5(3)获取变量类型函数 5(4) 强制类型转换函数 61parseInt()、parseFloat()和Number():数值型强转函数 62Boolean():布尔型强转函数。 63String():字符串强转函数 68.运算符 7(1)算术运算符: 7(2)自增/减运算符: 7(3)比较运算符 7(4)赋值运算符 7(5)逻辑运
2、算符 7第二章控制语句 8一、if条件语句 81.if语句 8二、几个js中常用的函数 9三、switch语句 9四、while循环 10六for循环 10七、两个关键字 10第三章数组 11一、定义 11二、声明 11三、属性 11四、获取数组元素 11五、数组方法 121.连接数组 122.添加元素 123.删除元素 124.提取数组元素 135.分隔符 136.反转元素:reverse():将数组元素的全部位置左右反转。 137.数组元素排序:sort( function(a,b) ) 138.数组转换成字符串 13六、遍历数组 14第四章函数 14一、定义 14二、匿名函数 15三、全
3、局变量和局部变量 15四、prototype 16五、JS的三种方法 16第五章常用对象 17一、Math对象 17二、Numbe对象 18三、document对象 18四、Date对象 19五.时间对象: 19七.DOM对象 201.把文档中标签转换DOM对象。 202.DOM对象的作用 203.DOM对象的几个事件句柄: 214.DOM对象的offset相关属性 22八、自定义对象 221定义方式 22六、String对象 231.创建 232.常用属性 233.常用方法 23第六章节点处理 25一、定义和分类 25二、节点内容 25三、节点之间的关系 26四、节点的控制:创建、添加、删除
4、、插入、克隆、替换 261.创建 262.添加 263.删除节点 264.插入节点 275.克隆节点:相当于复制,但不会粘贴。 276.替换子节点 277.节点应用知识: 27第七章正则表达式 29一、定义 29二、正则表达式作用: 29三、声明 291.显示声明 292.隐式声明 293.模式修饰符 29四、正则表达式字符 30五正则常用方法 31六前瞻 31总结: 331.调用JS三种办法:直接插入、声明写入、导入JS文件 332.声明常量与变量:const和var 333.六大数据类型:引用function,string,object和值类型:number 、undefined,bool
5、ean 334.强制类型转换:parseInt();parseFloat();Number(); String();Boolean()。 335.逻辑运算: a|b (a或b,true a false b)和 a&b 336.js常用函数: 337.控制语句: 348.三元表达式:ab?a:b; 349.声明数组和数组方法 3410两种函数声明方式(基本和引用),以及调用方法。 3411.函数体中(有var声明)是局部变量,否则是全局变量 3412.常用对象和其方法 3413.DOM 35(1)获取和设置DOM对象 35(2)获取相关节点对象 35(3)控制节点对象 35第一章基础语法1在页面
6、中使用js代码(1)直接使用:标签中插入点击(2)在html中任意位置声明写入 alert(11);(3)导入js文件2语法规则执行顺序:从上到下,从左到右。每行结尾加分号。3.常量声明常量:const常量名=值。 const AGE=27岁;4.变量1先声明再赋值: var age; age=31;2声明同时赋值:var age=31;3一个关键字声明多个变量:var a,b,c; a=1; b=1; c=1; var a=1,b=2,c=3;5.命名规则:常量:用大写英文单词变量: 字母或下划线开头,数字/字母/下划线组成; 不能使用关键字作为变量名; 区分大小写;6.注释:/单行注释 /
7、*多行注释*/7.数据类型(1)值类型:1 number(数字型):包括整数和浮点数 NaN非数字和Infinity无穷大是number型。2 undefined(未定义):未声明的或未赋值的变量。3 boolean(布尔型):true、false(2)引用类型1 string(字符串):单引号或双引号之间的所有字符。 单引号不能嵌套单引号,双引号不能嵌套双引号。反斜杠可转义引号成字符。2 object(对象):null空值是object型;3 function(函数):(3)获取变量类型函数typeof(varName);返回数据类型字符串。返回值是小写字符串,如string(4)非数字判断
8、函数isNaN(a):判断a是否是一个非数字,是返回true;不是返回false。(5)强制类型转换函数1parseInt()、parseFloat()和Number():数值型强转函数字符串类型:parseInt()和parseFloat():只有字符串中的第一个数字会被返回,若第一个字符不是数字则转成NaN。Number():字符串只能是数字字符,才能转为数字,否则为NaN未定义类型:undefined- NaN:对象类型:object-NaN; null-0布尔类型false-0; true-1;程序发生数学运算时,程序将自动将运算符两边的值转换为number型。2Boolean():布
9、尔型强转函数。”/undefined/null/0和 NAN :五种-flase 其他-true3String():字符串强转函数undefined/null/true和false/NaN,0,数字转换成相对应的字符串注:对象用 toString()方法转换成字符串:对象若存在,则转成的字符串就是toString()返回的值; 若不存在,则为undefined。8.运算符(1)算术运算符:+加-减*乘/ 除%余 +两边有一边是字符串,则作为字符串连接符。(2)自增/减运算符:+i;-i;先自增/减,后赋值。i+;i-;先赋值,后自增/减(3)比较运算符大于=大于等于小于b?a:b;条件?结果a
10、:结果b;条件为真时,返回结果a,假时返回结果b。第三章数组1.定义数组:用一个变量来存放多个有顺序条理的数据。js数组中可以存放任意类型数据。数组长度可变。(可以删除数组元素)数组的数据类型是object。数组元素可以是表达式。2.声明(1)显示声明 var arr=new Array(数组元素);(2)隐式声明 var arr=数组元素3.获取数组元素数组下标从左到右,从arr0开始。4.属性(1)length:返回数组长度值 var l=arr.length;说明:字符串也有length属性。5.方法(1)控制元素1添加元素.push(元素/数组):向数组的末尾添加一个或更多元素,并返回
11、新的长度。.unshift(元素/数组)向数组的开头追加一个或多个元素,并返回新的长度。 添加多个元素时,元素之间逗号隔开; 如果添加的数组,原数组新的元素为一个数组,此时原数组变成二维数组。2删除元素.pop():移除最后一个元素并返回该元素值。.shift():移除第一个元素并返回该元素值,数组中元素自动前移。.splice(a,b,c):(删除元素开始下标,删除个数,替换内容);返回删除元素组成的新数组。 a表示删除下标为a的元素以及其后的元素。 (a,b)表示从下标为a的元素开始,删除b个元素 (a,b,c):表示添加或替换,返回一个空数组。(因为元素个数没减少,所以为空。) 注:(1
12、)c可以是多个要添加的新元素:(a,b, val1,val2,valn)。 (2)c可以是一个数组:(a,b,arr) (3)a:表示新元素插入位置。 (4)b:表示从下标为a的元素之前开始替换b个元素; b为0时,表示在下标为a的元素之前,用c替换0个元素,即添加新元素; c中新元素个数小于b时,删除未替换完的元素。3提取数组元素.slice(a,b):提取从下标为 a的元素到下标b的前一个元素。不改变原数组。 如果b缺省,则提取a后面的所有元素。 如果 barr.length,等同于缺省。4反转元素:reverse():将数组元素的全部位置左右反转。5数组元素排序:数组名.sort(自定义
13、排序函数名);如arr.sort(zeng)自定义排序函数function zeng(a,b)return a-bfunction jian(a,b)return b-a排序规则:ASCII码顺序先排字符第一位,再比较字符第二位。6遍历数组for(var i(即数组下标) in 数组名)循环体; i,初始值为0,每循环一次自动加1,循环次数由数组元素个数决定。(2)控制数组(1)连接多个数组.concat(arr1,arr2,arrn):连接两个或更多的数组,并返回连接后的新数组。如:var arr3=arr.concat(arr1); 注:顺序连接。(2)将数组转换成字符串1arr.toSt
14、ring():将arr数组转换成字符串,字符之间用逗号连接。2arr.join():将数组arr中所有的元素用连接成一个字符串。3运算转换var str=arr+:将组数元素连接成字符串。第四章函数1.声明(1)基本形式:function 函数名 (形参列表) 函数体 return (2)引用形式: var 函数名=function(形参列表) 函数体 return (3)return说明:一个函数只能有一个返回值,但想返回多个值可以返回一个数组。return:把函数产生的结果,返回给函数外部使用。return只能在函数内部使用,且一个函数可以有多个return。return具有终止函数继续向
15、下执行的功能。等价于break。(4)两种声明函数方式的比较:以相同形式声明的同名函数,总是后声明的覆盖先声明。以基本形式声明的函数会提前加载到内存中;以引用形式声明的函数,总是在代码执行到的时候才会加载。于是,引用形式声明的同名函数,总是会覆盖以基本形式声明的同名函数。以基本形式声明的函数,可以在函数声明之前进行调用,但引用形式声明的函数只能在声明后调用。2匿名函数 js中没有函数名的函数就是匿名函数。(略)3.函数调用:函数名(实参列表); 实参给形参赋值是,从左到右依次赋值。 没有赋值的,其值为undefined。 实参比形参多,多的实参不报错不影响。 arguments(下标):获取实
16、参列表参数值。 arguments.length:获取参数列表个数。4.全局变量和局部变量在函数内部: 有var声明的变量是局部变量;外部不能访问局部变量。 无var声明的变量是全局变量,哪怕没有在函数外声明。如果在函数内部有一个局部变量和全局变量同名,那么在函数内访问时,首先访问的局部变量;如果要访问全局变量,则需要使用:window.全局变量名获取在函数内部声明的局部变量会声明提前。5.函数原型属性prototype每一个构造函数都有一个属性叫做原型(prototype)。prototype是一个对象,给prototype的属性添加属性或方法,这些属性或方法将会成为使用这个构造函数创建的对
17、象的通用属性。function Fish(name, color) this.name=name; this.color=color;Fish.prototype.price=20;Fish.prototype.getPrice= Function() return this.price;var x =new Fish();alert(x. getPrice ();6.JS的三种方法对象方法function People(name) this.name=name; this.Introduce=function() alert(My name is +this.name); 类方法People
18、.Run=function() alert(I can run);原型方法People.prototype.IntroduceChinese=function() alert(我的名字是+this.name);/测试var p1=new People(Windking);p1.Introduce();People.Run();p1.IntroduceChinese();第五章JS内置对象1.Math对象max(a,b,n)、.min(a,b,n):返回所有数字中最大值或最小值。random():返回01之间的随机数。不包括0、1。输出09的数:document.write(Math.floor
19、(Math.random()*10);ceil()、.floor():对一个数进行向上/下取整。round():四舍五入取整。注:Math对象的方法 返回的数据类型都是Number型。如Math.random()2.Numbe对象Number.toFixed(保留小数的位数)例子:var num = 13.37;document.write(num.toFixed(1);3.Date对象(1)创建当前时间的Date对象:var变量名 =new Date();(2)常用方法Date() :返回当天的日期和时间。getDate() :返回月份的某一天。getMonth() :返回表示月份的数字。g
20、etDay():返回表示星期的某一天的数字。使用 getHours(), getMinutes() 以及 getSeconds() 来显示当前的时间。(3)计时事件1定义:在一个设定的时间间隔之后来执行代码,而不是在函数被调用后立即执行。我们称之为计时事件。2创建计时对象var 对象名=setTimeout(javascript语句,毫秒)3清除计时对象clearTimeout(对象名)4应用在函数内部调用计时事件,达到死循环效果。 function fn() var sw=$(sp).offsetWidth; var num=Math.ceil(sw/pw*100) if(swpw) $(s
21、p).style.width=sw+2+px; $(sp1).innerHTML=num+% setTimeout(fn,20); 5类似方法setInterval(函数名/”js语句”,时间毫秒):每隔多少时间之后执行函数或者JS语句一次。clearInterval(时间对象):清除setInterval时间对象。4.String对象(1)两种创建字符串方式的区别var str=”abc”; str数据类型是字符串,但也可以调用String对象的方法和属性。var 变量名=new String(“值”);变量名数据类型是对象(2)属性length:返回字符串长度。(3)方法1)改变字符:.s
22、ub():把字符串显示为下标;.sup(): 上标。.toLowerCase():把字符串转换为小写。.toUpperCase(): 大写。replace(正则/子字符串,用于替换的字符串):用字符串来替换子字符串或正则表达式匹配的字符串。返回替换后的字符串。2查找字符charAt(index):返回下标指定位置的字符。超出则返回为空。indexOf(substr,index):返回String对象内第一次出现子字符串位置。如果没有找到子字符串,则返回-1。 参数:substr子字符串;index开始下标,下标缺省则默认从0开始。lastIndexOf(substr,index):返回Stri
23、ng对象中字符串最后出现的位置。如果没有匹配到子字符串,则返回 -1。 参数:substr子字符串;index结束下标,下标缺省则父字符串长度。search(正则/子字符串):返回与正则表达式查找内容匹配的第一个字符串的位置,或返回子字符串第一次出现位置。如没找到,返回-1。.match(正则/子字符串):在字符串内检索指定的值,或找到一个或多个正则表达式的匹配,如果是字符串搜索,返回找到子字符串,没找到返回空字符串。如果是正则搜索,找到返回数组,没找到返回null。3截取字符slice(start,end):提取起始到结束下标的子字符串。substr(start,length):返回指定位置
24、开始的,提取指定长度的子字符串。length缺省,则提取到末尾。start可为负数。 子字符串查找,只替换第一次找到的字符串; 正则表达式查找,除非全局匹配,也只能替换第一次找到的字符串。substring(x,y):返回String对象中下标x,y之间的子字符串。x,y哪个值小就是起始位置。.split(正则/字符串):取掉字符串或正则,把断开的原字符串分割为字符串数组。5.document对象1.属性:.title:获取/设置文档标题;.bgColor:获取/设置文档背景色;.fgColor:获取/设置文档内容颜色。2.方法(1)输出方法write()、writeln()(2)获取和控制节
25、点对象createElement(tag):根据指定标记创建一个HTML标签getElementById(id):获得指定id的HTML元素getElementByName:获得指定名称的HTML元素的数组getElementByTagName:获得指定标签名称的HTML元素的数组第六章节点对象(DOM)1.定义(1)DOM对象Document Object Model文档对象模型。 DOM对象,有时我们也叫DOM元素。D即html、xml文档(标签);O即把文档中内容 (标签),转换为Object 对象;M即模型,程序设计一钟架构。(2)节点定义和类型HTML DOM中,每个部分都是节点。可分为:文档节点:即文档本身;元素节点:即:所有HTML元素;属性节点:所有HTML属性;文本节点:HTML元素内的文
copyright@ 2008-2022 冰豆网网站版权所有
经营许可证编号:鄂ICP备2022015515号-1