web前端——入门级JavaScript

一、JavaScript
1．页面脚本
2．客户端验证，Ajax，页面特效
3．JS是一个标签
（1）内部JS标签

（2）外部JS文件

4．JS中的变量
（1）类型：弱类型
variable 变量
var a;
声明但未赋值： undefined var a; 声明只说明是变量，不确定类型
字符串类型： string a=’’/’a’/””/”aaa”; 没有单字符的概念
数字类型： number a=5/5.20; 没有整数和小树的概念
布尔类型： boolean a=true/false;
对象类型： object a=null/new Array(); 没有类的概念
（2）创建固定长度的数组：
var arr = [“aa”,”bb”,”cc”];
var arr = new Array(“aa”,”bb”,”cc”);
常用方法：
尾部追加：arr.push(var value);
连接数组元素：arr.join(var sep);
（3）赋值
a = 5;
a = “abc”;
5． JS中的特殊运算符
（1）所有的等值判断：
①== 字面值比较
②=== 值和类型双比较
（2）foreach循环
当前遍历的数组对象元素
arr.forEach(function(obj[,index]){
当前元素对象在数组中的索引
return false; //前置退出循环
…
});
二、缩略语法
1．标签名称[属性1=’[值]’ … 属性n=’[值]’]>子元素[…]*n+子元素[…]+(select[…]>option[…]*5)
三、JS获取页面对象
1．BOM模型 Browser Object Model
（1）页面定位属性：location
①重新定位当前窗口页面的方式
1）超链接
2）location
3）window.open(url, target); //弹窗
4）div.load();/Ajax;
（2）页面访问历史：histroy
①window.history.forward(); window.history.go(1);
②window.history.back(); window.history.go(-1);
（3）文档对象：document
①当前URL：URL
②载入当前URL的URL：referrer
③获取当前页面中的标签元素对象
1）var obj = document.getElementById(“id选择器”); 根据ID获取唯一标签元素对象
2）var arr = document.getElementByName(“name属性值”); 数组（forEach有效）
3）var arr = document.getElementByTagName(“标签名称”); 数组（forEach无效）
4）var arr = document.getElementByClassName(“类选择器名称”); 数组（forEach无效）
5）按层次访问以某个元素对象做为参考的对象
a．父级元素
b．父辈元素
c．同辈元素
d．相邻元素
e．子代元素

④操作JS对象
1）表单元素obj的值：obj.value [=值]
2）非表单元素的内容：
a．obj.innerText [=值] 值会被作文本解析
b．obj.innerHTML [=值] 值会被作结构解析
3）所有元素具备的属性值都可以修改
4）元素的样式：obj.style.属性 [= “值”];
⑤JS事件
1）点击事件：obj.onclick
2）窗口的加载事件：window.onload 每个窗口只有一个
3）鼠标进入事件：obj.onmouseenter 鼠标进入标签的瞬间
4）鼠标离开事件：obj.onmouseleave 鼠标离开标签的瞬间
5）键盘按下事件：obj.onkeydown 某键按下
6）键盘松开事件：obj.onkeyup 某键松开
7）键盘点击事件：obj.onkeypress 按键点击
⑥事件函数绑定
1） 静态调用
2）obj.eventName = functionName; 一次性
3）obj.eventName = function(){…} 复用性绑定