JavaScript——原生基础及事件

  1. toLocaleString(): 可把时间对象转换为字符串(我们需要的格式)

  2. getTime(): 返回的是 1970年1月1日距今的 毫秒数

  3. setTime(): 以毫秒数 设置Date对象

  4. setFullYear(): 设置 年 月 日 (月份是0~11)

  5. setMonth() : 设置 月 日 毫秒

  6. setHours() : 设置 时 分 秒 毫秒

  7. setMinutes(): 分 秒 毫秒

  8. getFullYear(): 获取年份

  9. getMonth(): 获取到月份 取值范围 0~11

  10. getDate(): 获取一个月中的第几天

  11. getDay(): 获取一周中的第几天

  12. getHours(): 获取小时

  13. getMinutes(): 获取分钟

  14. getSeconds(): 获取秒数

定时器

=============================================================

普通定时器:

方法:

setInterval(): 会去重复执行某一个功能

代码示例:


		var box = document.getElementsByClassName("box")[0];		

		var i = 0;	

		var num = 0;  //定时器的 次数 记录器  (自定义的)

		var time = setInterval(function (){

			i = Math.floor(Math.random()*250);

			box.innerHTML = "啊啊啊~~" + i;

			num++;  //变量自增

			

				if(num > 5){  //如果到达指定条件

				//清除定时器:

				//   1. 需要有记录器(变量自增),来记录运行次数,

				//		 到达指定条件时触发

				//   2. 定义定时器时,需要定义变量来保存这个定

				//      时器(例如: time),然后使用

				//		 clearInterval()方法。来清除这个变量中

				//      的定时器,并将这个变量置空(time = null)

				clearInterval(time);

				time = null;	

				}

				

		},1000);



备注:

参数1: 每次执行的具体任务, 自定义

参数2: 每次执行的间隔时间, 自定义 单位为毫秒

单次定时器:

作用: 只执行一次的定时器

方法: setTimeout();

参数1: 执行的具体任务

参数2: 间隔多久执行 (延迟)

代码示例:


			var time_two = setTimeout(function(){

				box.style.backgroundColor = "yellow";

				console.log("啦啦啦");

			},2000);



事件类型

==============================================================

单击事件:

方法: onclick()

如何添加:

  1. 获取元素,在js中给元素绑定

    备注: 直接赋值使用,不需要函数名

代码示例:


var box = document.getElementsByClassName("box")[0];

btn.onclick = function(){

	box.style.backgroundColor = "rgb(" + randomColor() 

	+ "," + randomColor() + "," + randomColor() + ")";		

}

function randomColor(){

		return Math.floor(Math.random()*(250-200)+200);

}



  1. 定义好函数, 在html标签中 绑定函数

代码示例:


<button class="btn" onclick="myClick()">按钮</button>

function myClick(){

	box.innerHTML = "啊~~";

}




方法: onload

作用:

1)当页面(html,图片之类)加载完成后,执行的方法

2)该方法用于,包裹所有内联js代码

3)解决js获取html标签时,标签还没有加载的情况

4)先加载页面,再加载功能。 能够提高用户体验

代码示例:


window.onload = function(){

	1. 这里存放 所有内联的js代码

	2. 以保证,先加载页面,再加载js功能			

			}



方法:

  1. onblur: 失去焦点

  2. onfocus: 获得焦点

  3. onselect: 选中文本时触发

  4. onchange: 在内容发生改变是触发

  5. onreset: 重置时触发

鼠标类事件:

  1. ondblclick: 双击时触发

  2. onmouseover: 鼠标移入

  3. onmouseout: 鼠标移出

  4. onmousedown : 用户在指定元素身上 按下时触发

    备注: 除非情景 需要 按下 和抬起各执行一个功能,否则,不使用,因为按下就触发,没有给用户改错的机会

键盘事件:

  1. onkeydown: 用户按下键位的时候触发

  2. onkeyup : 用户抬起键位时

  3. onkeypress: 用户按下该键位 再抬起时触发

event对象

=================================================================

作用: 表示事件源本身

备注: 我们在使用的时候,以形参的形式来使用,实参由事件本身传递,使用时,一定符合见名知意: 例如: event ev evt e

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值