1.什么是javascript?
JavaScript是运行在客户端的解释性脚本语言;
2.javascript作用:
1.表单验证
2.网页特效
3.ajax功能
3.javascript语法结构
1.引入外部的js文件,扩展名为.js
<script type="text/javascript" src="js文件url"><script>
2.书写与文档内部
<script type="text/javascript">
....
</script>
3.javascript语法严格区分大小写,每行js代码“必须”以分号结尾;
4.变量
1.什么是变量?
变量是指存储在内存有名称的信息,其值在程序运行期间可以发生变化;
2.声明变量
var 变量名称;
var 变量名称=值;
说明:1.var关键字可以省略,但不建议省略;
2. 变量必须以字母或下划线开头,包含字母、数字、下划线,但不能包含空格、斜线、反斜线等特殊符号;
3. 变量名称禁止与系统关键字、保留关键字相同;
3.关键字
var if else swith case break for in do while function
4.保留关键字
float class integer boolean string interface extends implements public protected private
5.数据类型
undefined(未定义),是指声明但没有赋值或赋值为undefined的变量或未定义返回值的函数或方法;
string:必须括在单引号或双引号之间;
转义符
\n 换行
\r 回车
\t 水平制表符
\v 垂直制表符
\f 换页
\\反斜线
\'单引号
\" 双引号
number 数值或浮点数
boolean 布尔型,结果只能为true或false;
function 函数,实现一次定义多次调用;
object 对象
null 空值
在通过typeof()函数进行测试时,undefined的类型为undefined,而null的类型为object
6.流程空值语句
for...in语句
for(key in array/object){
执行代码;
}
eg:for(key in arr){
console.log(key+‘__’+arr[key]);
}
ES5中支持数组的forEeach()方法
array.forEach(function(value,index){
执行代码;
});
<script>
//ES5中才支持数组的forEach操作
var arr = new Array();
arr[0] = '中国';
arr[3] = '法国';
arr[6] = '德国';
arr[8] = '英国';
arr.forEach(function(val,index){
console.log(val + '--' + index);
})
</script>
7.运算符
1.字符运算符:+
2.数学运算符 + - * / %
3.自增自减运算符 n++ n-- ++n --n
后缀形式:先使用,后加减
前缀形式:先加减,后使用
4.比较运算符:> >= == != === !== <= <
5.逻辑运算符 ! && ||
8.内置对象
1.string对象
1.声明string对象
直接量方式
var 变量名称=“值”;
构造函数方式
var 变量名称=new String(【“值”】);
2.属性
length
描述:获取字符串的长度
语法:int object.length
3.方法
toLowerCase()
描述:字符串转换成小写
语法:string object.toLowerCase(void)
toUpperCase()
描述:字符串转换成大写
语法:stirng object.toUpperCase(void)
substr
描述:截取字符串
语法:string object.substr(int start, 【int length】)
说明:
1.字符从0开始编号,
2.如果没有指定length参数,则返回从开始位置到字符串结尾之间的内容
3.如果start 参数为负数,则倒数;
substring
描述:提取字符串中介于两个指定下标之间的字符
语法:string object.substring(int start,[int end])
说明:
1.如果没有指定end,则返回从开始位置到字符传结尾之间的内容
2.包含起始位,但不包含结束位,起始从0开始。
eg: var str="helloworld"; str.substring(3,7)==>lowo
replace()
描述:字符串替换
语法:stringobject.replace(string search,string replacement);
stringobject.repalce(object RegExp,string replacemeng)
eg:var str="visitmicrosoft"; str.replace("vis","aaa"); ==>aaaitmicrosoft;
var str2="VisitMicrosoft";str.replace("/i/g","v"); ==>Vvsvtmvcrosoft;
search();
描述:用于检索字符串中指定的子字符串(从起始位置开始检索,不支持g全局检索)
语法:int stringobject.search(regexp);
说明:regexp该参数可以是需要在 stringObject 中检索的子串,也可以是需要检索的 RegExp 对象,要执行忽略大小写的检索,请追加标志 i。
stringObject 中第一个与 regexp 相匹配的子串的起始位置。
eg:var str="visit w3cschool!" str.search(/w3cschool/) ==>6
split()
描述:用于吧一个字符串分割成字符串数组。
语法:stringobject.split(separator,howmany)
说明:separator,必须,字符串或正则表达式,从该参数指定的地方分割stringobject
howmany 可选,该参数可以指定返回的数组的最大长度,如果设置了该参数,返回的子串不会多于这个参数指定的数组,如果没有设置该参数,整个字符串都会被分割,不考虑长度。
2.Math对象
说明:Math对象是一个静态对象;
访问属性
Math.属性名称
调用方法:
Math.方法名称()
属性
Math.PI
Math.SQRT2
方法
Math.ceil()
描述:进一取整
语法:number Math.ceil(number arg)
Math.floor()
描述:舍一取整
语法:number Math.floor(number arg)
Math.pow()
描述:幂运算
语法:number Math.pow(number base,number exp)
Math.sqrt()
描述:获取平方根
语法:number Math.sqrt(number arg)
Math.random()
描述:产生随机数(0<=n<1)
语法:number Math.random(void)
Math.round()
描述:四舍五入(只能保留到整数位)
语法:number Math.round(number arg)
3.Date对象
创建Date对象
var 变量=new Date();
方法
getYear()
描述:获取年份(从1900年到现在经历的年份)
语法:int object.getYear(void)
getFullYear()
语法:int object.getFullYear(void)
getMonth()
描述:获取月份(返回范围为0~11)
语法:int object.getMonth(void)
getDate()
描述:获取是该月的第几天
语法:int object.getDate(void)
getDay()
描述:获取星期的第几天(0为星期日,依次类推)
语法:int object.getDay(void)
getHours()
描述:返回小时(范围为0~23)
语法:int object.getHours(void)
getMinutes()
描述:返回分钟(范围为0~59)
语法:int object.getMinutes(void)
getSeconds()
描述:返回秒数(范围为0~59)
语法:int object.getSeconds(void)
getTime()
描述:返回毫秒级时间戳
语法:int object.getTime(void)
4.Array对象
创建Array对象
构造函数方式
var 变量名称 = new Array(int length)
var 变量名称 = new Array(value,value,...)
直接两方式
var 变量名称 = [[value][,...]]
属性
length
描述:获取数组成员数量
语法:int object.length
方法
push()
描述:在数组的末尾添加一个或多个成员
语法:int object.push(mixed value [...])
unshift()
描述:在数组的开头添加一个或多个成员
语法:int object.unshift(mixed value[,...])
shift()
描述:删除数组的第一个成员,并且返回改成员
语法:mixed object.shift(void)
pop()
描述:删除数组的最后一个成员,并且返回改成员
语法:mixed object.pop(void)
join()
描述:讲述组成员使用分隔符链接成字符串
string object.join(string separator)
说明:separator 可选,指定要使用的分隔符,如果省略该参数,则使用逗号作为分隔符号。
eg;var arr=new Array("a","b","c"); arr.join()==>a,b,c
HTMLDOM
1.什么是HTMLDOM?
HTML DOM是提供针对处理HTML文档的方法;
2.获取对象
Element Document.getElementById(string id)
NodeList Document.getElementsByTagName(string tagName)
NodeList Element.getElementsByTagName(string tagName)
NodeList Document.getElementsByName(string name)
3.操作属性
获取属性
[var 变量名称=] object.attribute
设置属性
object.attribute = value
说明:
A.大部分HTML标记的属性即HTMLDOM对象的属性;
B.如果HTML标记的属性为合成词(如表格的cellpadding、cellspacing、bgcolor,单元格的rowspan、colspan等),在HTML DOM编程时必须采用"驼峰标记法"表示;
C.HTML标记的class属性在HTMLDOM编程中用className属性取代(因为class是ES的保留关键字);
D.HTML标记的style属性在HTMLDOM编程中返回CSSStyleDeclaration/CSS2Properties对象(不同浏览器运行结果可能会不一样);其引申出:
设置对象style属性的语法
[var 变量名称=] object.style.CSS属性名称
获取对象style属性的语法
object.style.CSS属性名称 = 值
说明:
A.大部分CSS属性即CSSStyleDeclaration/CSS2Properties对象属性;
B.对于CSS属性中带有短横线的属性,在CSSStyleDeclaration/CSS2Properties对象将短横线去掉后,再采用"驼峰标记法"标记;
C.CSS属性中的float属性,在CSSStyleDeclaration/CSS2Properties对象将采用cssFloat(针对Chrome、Firefox浏览器)或styleFloat(针对IE浏览器)取代;
*E.对于某些HTML标记中,属性名称与属性值相同的属性(如单选框/复选框的checked属性,option标记的selected="selected"属性,HTML表单控件的disabled="disabled"),在HTMLDOM中用boolean表示;
4.操纵内容
object.innerHTML
object.innerText
说明:
A.innerHTML和innerText属性是实时标准;
B.innerHTML可以解析HTML标记;innerText不能解析HTML标记;
5.增/删节点
说明:HTMLDOM中除极少数有自己的创建、删除节点的方法外,大部分对象仍然要使用DOMCore方法进行节点的增/删操作。
5.1 Image对象
var 变量名称 = new Image([width,height])
5.2 Table对象
5.2.1 Table对象
insertRow()方法
描述:在表格内插入行
语法:HTMLTableRowElement object.insertRow(int index)
deleteRow()方法
描述:删除行
语法:void object.deleteRow(int index)
5.2.2 Tr对象
rowIndex
描述:获取行对象的索引值
语法:int object.rowIndex
insertCell()方法
描述:在行内插入列
语法:HTMLTableCellElement object.insertCell(int index)
deleteCell()方法
描述:删除单元格
语法:void object.deleteCell(int index)
5.3 Select对象
5.3.1 Select 对象
length属性
描述:获取/设置列表框中option的数量
语法:object.length = value
[var 变量名称=] object.length
value属性
描述:获取列表框中被选定选项的值
语法:string object.value
add()方法
描述:添加option对象
语法:HTMLSelectOptionElement object.add(optionElement)
remove()方法
描述:删除option对象
语法:void object.remove(int index)
5.3.2option对象
创建对象
var 变量名称 = new Option(text,value)