【javascript】面向对象

定义类

function Person(name){ 
	this.name = name;
};
var p = new Person('taibai');  
console.log(p.name);
Person.prototype.sum = function(a,b){  //封装方法
	return a+b;
};
p.sum(1,2);

data对象

//方法1：不指定参数
var d1 = new Date(); //获取当前时间
console.log(d1.toLocaleString());  //当前2时间日期的字符串表示
//方法2：参数为日期字符串
var d2 = new Date("2004/3/20 11:12");
console.log(d2.toLocaleString())

常用方法
var d = new Date(); 
使用 d.getDate()
//getDate()                 获取日
//getDay ()                 获取星期 ，数字表示（0-6），周日数字是0
//getMonth ()               获取月（0-11,0表示1月,依次类推）
//getFullYear ()            获取完整年份
//getHours ()               获取小时
//getMinutes ()             获取分钟
//getSeconds ()             获取秒
//getMilliseconds ()        获取毫秒
//getTime ()                返回累计毫秒数(从1970/1/1午夜),时间戳

json对象

var li = [1,2,3,4];
var b = JSON.stringify(li); //序列化
var c = JSON.parse(b); //反序列化

RegExp对象

var re1 = new RegExp("[0-9]");
var re1 = /[0-9]/;
re1.test(1); //没有参数时默认参数为undefined
re1.lastIndex;//设置从启示索引,没设置一次加一
re1.lastIndex=0;//归零

字符串使用正则方法

方法名	描述
match()	匹配元素
match(/z/g)	全局匹配
search()	得到匹配元素的索引
split()	分割字符串
replace(/a/gi,“新值”)	替换g全局替换，i不区分大小写

math对象

方法	描述
abs()	绝对值
floor()	获取整数
log()	返回数的自然对数
max(x,y)	最大值
min(x,y)	最小值
pow(x,y)	x的y次幂
random()	0-1之间的随机数
sin()	返回数的正弦
sqrt()	返回数的平方根
tan()	返回角的正切

bom对象

location

方法	描述
href	获取url
href=“url”	跳转url
reload()	刷新页面

定时器

单次执行

var a = setTimeOut(function f1(){confirm("show");},3000);
var a = setTimeOut("confirm('show')",3000);
clearTimeout(a)//清除计时器

循环执行

var a = setInterval('confirm("show")',3000);
clearInterval(a)//清除计时器

dom对象

标签操作

查找标签

方法	描述
getElementById	根据id获取标签
getElementByClassName	根据class属性获取，多个元素时结果是数组类型
getElementsByTagName	根据标签名获取标签合集
parentElement	父节点标签
children	所有子标签
firstElementChild	第一个子标签
lastElementChild	最后一个子标签
nextElementSibling	下一个同级标签
previousElementSibling	上一个同级标签

var divEle = document.getElementById('d1');
dirEle.parentElement;

操作标签

方法	描述
createElement()	创建标签
innerText=""	添加文本
appendChild()	追加一个节点
insertBefore(a,b)	将a添加到b的前面
innerText()	获取子标签内所有标签文本内容
innerHtml()	获取子标签内所有内容包括html

删除标签

方法	描述
removeChild()	删除节点，通过父级元素调用

替换标签

方法	描述
replaceChild(new,old)	替换节点，通过父级元素调用

属性操作

由父级元素调用

方法	描述
setAttribute(“age”,“18”)	创建属性
removeAttribute(“age”)	删除属性

<a href="http://www.baidu.com">百度</a>
var a = document.getElementsByTagName('a');
		a[0].href;  获取值
		a[0].href = 'xxx'; 设置值

获取值

var inpEle = document.getElementById('username');
	inpEle.value;//获取input值
	inpEle.value = '1';//设置input值
var selEle = document.getElementById('select1');
	selEle.value;//获取select值
	selEle.value = "1";//设置select值

类操作

方法	描述
className	获取所有样式类名
classList	标签对象的所有class类值
remove()	删除类
add()	添加类
contains()	判断类是否存在
toggle()	存在删除，否则添加

设置css

1. 对于没有中横线的CSS属性一般直接使用style.属性名即可。
2. 对含有中横线的CSS属性，将中横线后面的第一个字母换成大写即

divEle.style.backgroundColor = 'yellow';//设置
divEle.style.backgroundColor;//获取

事件

属性	描述
onclick	点击事件
ondblclick	鼠标双击对象
onmouseover	鼠标移动到 HTML 元素上
onmouseout	鼠标从某元素移开
onmouseout	鼠标移开 HTML 元素
onkeydown	用户按下键盘按键
onload	浏览器已经完成页面加载
onchange	内容发生改变触发

绑定事件

var divEle = document.getElementById('d1');
        divEle.onclick = function () {
            this.style.backgroundColor='purple';
        }

页面载入

wiondw.onload = function(){}