JavaScript
----------
数组对象
声明:
var arr = new Array();
var arr = [];
赋值
var arr = new Array('hello',0,true);
arr[0] = 'hello';
//单独一个整数,是数组的长度
var arr = new Array(7);
数组的输出
document.write(arr);
属性:length 数组的长度
方法:
数组对象.concat(数组对象)
功能:将两个数组对象合并为一个数组对象
数组对象.pop()
功能:从数组的末尾弹出最后一个元素。返回被弹出的元素。
数组对象.push(数组元素)
功能:从数组的末尾添加一个新的元素,返回被添加元素后的数组长度。
数组对象.shift()
功能:从数组的头删除一个元素。
数组对象.unshift()
功能:向数组的头部添加元素。
数组的遍历
for(key in 数组对象)
- 数学对象
Math
属性:PI
方法:
Math.abs(变量)
功能:取变量的绝对值
Math.round(变量)
功能:对变量四舍五入取值
Math.ceil(变量)
功能:对变量向上取整
Math.floor(变量)
功能:对变量向下取整
Math.max(变量1,变量2)
功能:取变量中的较大者
Math.min(变量1,变量2)
功能:取变量中的较小者
Math.random()
功能:产生一个伪随机数,(0~1)
对象
var obj = new Object();
var obj = {};
声明对象赋初值
var obj = new Object({username:'jack',age:10});
var obj = {username:'jack',age:10}
对象属性的访问:
obj.username;
八、自定义函数
声明:
1、function 函数名称([参数...]){
函数体
}
函数名称:- 数字、字母、下划线函数名称。
- 函数名成要尽量起得有意义,函数名称采用小驼峰式命名规则。
参数:形参。变量局部变量。
函数体:函数实现的功能,被重复执行的代码段。输出运算后的结果。返回(return)回运算后的结果。
2、匿名函数
var test = function([参数...]){
函数体
}
3、var test = new Function("a","b","document.write(a+b)")
调用:
1、函数名称();
2、事件
3、超链接
> <a href="javascript:函数名称();"></a>
变量的作用域:
全局作用域:在函数体外声明的变量,作用域是全局的。
局部作用域:在函数体内声明的变量,作用域是局部的。作用域仅在函数体内有效。
九、DOM
Document Object Model 文档对象模型。
Document:HTML/XML
XML
eXtension Markup Language 可扩展标记语言
用途:
信息的载体和传递者。
特点:
不作为
Object 对象,JavaScript对象
将HTML文档转换为JavaScript对象的方式
- 通过HTMLTag标签进行转换
document.getElementsByTagName(HTML Tag标签的名称)
功能:将HTML文档转换为JavaScript对象。
返回:nodelist对象,数组。
- 通过HTML文档的name属性值来进行转换
document.getElementsByName(name属性值);
返回:nodelist对象,数组。
- 通过HTML文档的id属性值来进行转换
document.getElementById(id属性值);
返回:对象。
- 属性
读
设置(写)
- 文本
读
对象.innerText
对象.innerHTML
写
对象.innerText = "文本内容"
对象.innerHTML = "文本内容"
其中:innerText不能解析HTML标签,innerHTML可以解析HTML标签。
- 样式
读:
对象.style.css样式名称
写:
对象.style.css样式名称 = 属性值;
css样式名称,若有带中线的样式名称,要求将中线去掉,下一个但是首字母大写。即css样式名称要求使用小驼峰式命名规则。
批量添加css样式
对象.className = 'class样式的名称'
批量删除css样式
对象.className = ''
Model
如果将HTML看成一个倒置的树,那么树上HTML节点,文本,注释,属性和文档都可以被看为树形结构上的一个节点(node).节点都有节点名称(nodeName).节点类型(nodeType).有些节点有节点值。
节点之间互相有联系,找到其中的一个节点,就可以找到整个HTML文档中的全部节点。
关系:
父:parentNode
子节点:childNodes
firstChild 第一个子节点
lastChild 最后一个子节点
同胞节点:previousSibling 上一个同胞节点
nextSibling 下一个同胞节点
1、创建新的节点
document.createElement(HTML Tag)
功能:创建一个新的节点
返回:新的节点对象
2、添加到HTML文档中
对象.appendChild(子节点对象)
3、删除节点
对象.removeChild(子节点对象);
十、事件
1、事件源
所有HTML标签都可以被视为事件源
2、事件
鼠标:click 单击
dblclick 双击
mouseover 鼠标划入
mouseout 鼠标划出
文档:load 加载
unload 文档关闭之前触发的事件
键盘:keypress 键盘按下
keydown 键盘按下
keyup 键盘抬起
表单:focus 获取焦点
blur 失去焦掉
submit 提交
change 改变
事件的响应:
1、<tag on事件名称="事件响应的代码">
2、var 对象.on事件名称 = function(){
}
十一、BOM
BOM Browser Object Model 浏览器对象模型
属性:
window.location.href
innerWidth :浏览器的宽
innerHeight :浏览器的高
方法:
alert() 功能: 弹出一个对话框
confirm() 功能:弹出一个对话框,带有确认功能。
setTimeout(code,millisec)
功能:在millisec毫秒时间间隔后,执行一次代码code
参数:code 执行的代码。代码必须放在引号里面执行。例如:"alert()""move()",
或者是匿名函数,匿名函数不用放到引号里面。
millisec 单位毫秒
返回:id值
clearTimeout(setTimeout 返回id);
功能:停止setTimeout。
setInterval(code,millisec)
功能:间隔millisec后,执行代码code。
参数:code 是一段javascript代码或者是自定义函数的名称要求写在字符串里面。
是匿名函数,不用写在字符串里面。
millisec 毫秒
返回:id
clearInterval(setInterval 产生的id);
功能:停止setInterval
还不快抢沙发