JavaScript:常用总结
● 语法要点
● 引用类型
● BOM/DOM
● 事件要点
语法要点
在声明变量时,如果省去了var关键字,那么这个变量为全局变量。
数据类型有5种原始类型和9种引用类型:
原始类型中:Number、String、Boolean、Null、Undefined。使用typeof null获 得的类型为Object !
引用类型:Array、Date等
//全局函数
parseInt();
parseFloat();
Number();
String();
Boolean();
encodeURI("被编码的字符串");
decodeURI("被解码的字符串");
eval("将字符串转成js可识别的代码");运算符
//1.两个值比较时,如果两方都为number,可直接比较
//2.number和String比较时,先将String转成number比较
//3.如果两方都为String,比较ASCII值。
//等性运算符
== != 判断数值
=== !== 判断数值和类型
//逻辑运算符
&& || !
在js中逻辑运算符两边可以写任何东西,运算时
先将运算符两边的对象转成boolean值,再进行运算,
运算结果为对象本身。
非空对象、非0数字、非空字符串为true 其他为false。引用类型
1.Array : 可存放任何数据类型的值的长度可变数组
//1.创建
new Array();//创建空数组 new Array(3);//创建包含指定个数的数组 new Array[ele1,ele2...];//创建包含指定元素的数组 //2.常用方法 join("分隔符");//按指定的分隔符分割 sort();//操作数组结构 对数组进行排序 reverse();//颠倒数组中元素的顺序 concat();//连接两个或更多的数组,并返回结果
2.Date :
//创建: new Date();
//常用方法
toLocalString();//根据本地时间格式,把 Date 对象转换为字符串。
getFullYear();//从 Date 对象以四位数字返回年份。
getMonth();//从 Date 对象返回月份 (0 ~ 11)。
getDate();//从 Date 对象返回一个月中的某一天 (1 ~ 31)。
getHours();// 返回 Date 对象的小时 (0 ~ 23)。
getMinutes();//返回 Date 对象的分钟 (0 ~ 59)。
getSeconds();//返回 Date 对象的秒数 (0 ~ 59)。
getMilliseconds();//返回 Date 对象的毫秒(0 ~ 999)。
getTime();//返回 1970 年 1 月 1 日至今的毫秒数。
3.正则
//编写
var reg = new RegExp(正则表达式, 匹配模式);
var reg = /正则表达式/匹配模式;
//匹配模式
i: 忽略大小写
g: 全局匹配(模糊匹配)
//常用规则
[] : 可选的值有哪些
{} : 可选值出现的位数
* : 0到多次
? : 0次或1次
+ : 1次到多次
^ : 以什么开头
$ : 以什么结尾
//校验
正则表达式.test("被校验的字符串"); 返回boolean值
var zz = /^[A-z]$/i;
BOM/DOM
window(窗体对象)
//常用方法
//1.定时器(周期执行|单次执行)
var 定时器ID = setInterval(函数名,毫秒值);//周期
= setTimeout(函数名,毫秒值);//单次
clearInterval(定时器id)//清除
clearTimeout(定时器id)//清除
//2.警告框 alert();
//3.对话框 prompt();
//4.确认框 confirm();
location(链接对象)
location.href; //当前页面的路径
location.href=路径;//跳转到指定路径
location.reload;//重载页面
history(历史对象)
//常用方法
forward();//向前一个页面
back();//返回上一个页面
go(num);//前进num页
go(-num);//后跳num页
DOM对象常见用法
//1.获取元素对象的方法
document.getElementById("id");
document.getElementsByTagName("标签名");
document.getElementsByClassName("class属性值");
document.getElementsByName("name属性值");
//2.操作标签
元素.属性名称; // 获取指定属性的值
元素.属性名称 = "属性值";// 设置指定属性的值
//3.操作标签体
元素对象.innerHTML;// 获取标签体的所有内容
元素对象.innerHTML = "<h1>文本内容</h1>";
元素.innerHTML = "";// 删除
//4.操作文本:标签体(仅仅是文本)
元素.innerText;// 获取文本信息
元素.innerText = "值" ; //设置文本信息
//5.操作css属性
元素对象.style.css属性;// 获取css属性的值
元素对象.style.css属性 = 值;//设置css属性的值
注意css名称的写法!!!
一个单词的写法相同,两个单词的用驼峰命名法!
事件要点
1.常用事件
//onload、onclick、ondbclick、onsubmit、
//onfocus、onblur、onchange(改变事件)、onreset
//onmouseover、onmouseout、onmousedown、
//onmouseup、onmousemove
注意表单提交事件!
<form onsubmit="return checkForm()"></form>
2.事件和事件源的绑定
方式一:绑定(给事件源添加事件属性)
<xxx 事件属性="函数名()"></xxx>
方式二:派发事件(此法需留意代码加载顺序)
//a.获取事件源对象
var obj = document.getElementById("xxxId");
//b.给事件源派发事件
obj.事件名 = function();