JavaScript——页面相关事件

页面事件是在页面加载或改变浏览器的大小、位置,以及对页面中的滚动条进行操作时,所触发的事件处理程序。

加载与卸载事件

加载事件(onload)是在网页加载完毕后触发相应的事件处理程序,它可以在网页加载完成后对网页中的表格样式、字体、背景颜色等进行设置。卸载事件(unload) 是在卸载网页时触发相应的事件处理程序,卸载网页是指关闭当前页或从当前页跳转到其他网页中,该事件常被用于在关闭当前页或跳转其他网页时,弹出询问提示框。

在制作网页时,为了便于网页资源的利用,可以在网页加载事件中对网页中的元素进行设置。

例子:网页加载时缩小图片

在网页加载时,将图片缩小成指定的大小,当鼠标指针移动到图片上时,将图片大小情复成原始大小,这样可以避免使用大小相同的两个图片进行切换,并在关闭网页时,用提示框提示月户是否关闭当前页。

<html> <head> <meta charset="utf-8"> <title></title> </head> <body onunload="pclose()"> <img src="img/banner01.png" name="img1" onload="blowup()" onmouseover="blowup()" onmouseover="reduce()"/> <script type="text/javascript"> var h=img1.height; var w=img1.width; function blowup(){ //缩小图片 if(img1.height>=h){ img1.height=h-100; img1.width=w-100; } } function reduce(){ //恢复原始大小 if(img1.height>=h){ img1.height=h; img1.width=w; } } function pclose(){ //卸载时弹出提示框 alert("欢迎浏览本网页"); } </script> </body> </html>
点赞
收藏

评论区

加载中...

相关推荐

总结:常用js方法

javascript函数注释/获取页面缓存@methodgetSession函数名@param参数名字符串类型,需要获取的key名@return变量名对象类型/img.onload定义和用法onload事件在图片加载完成后立即执行。判断设备constuserAgentnavigator

盘点JavaScript focus/blur(聚焦)实际应用

大家好,我进阶学习者。一、前言当用户点击某个元素或使用键盘上的Tab键选中时,该元素将会获得聚焦(focus)。当网页加载时,HTML特性(attribute)。autofocus也可以让一个焦点落在元素上,不仅如此,还有其它途径可以获得焦点。二、focus/blur事件当元素聚焦时,会触发focus事件,当元素失去焦点时,会触发blur事件。

SSR再好,也要有优雅降级策略哟~

1、相关概念CSR:客户端渲染(ClientSideRender)。渲染过程全部交给浏览器进行处理,服务器不参与任何渲染。页面初始加载的HTML文档中无内容,需要下载执行JS文件,由浏览器动态生成页面,并通过JS进行页面交互事件与状态管理。SSR:服务端渲染(ServerSideRende

Android Hook技术

1\.什么是HookHook英文翻译过来就是「钩子」的意思,那我们在什么时候使用这个「钩子」呢?在Android操作系统中系统维护着自己的一套事件分发机制。应用程序,包括应用触发事件和后台逻辑处理,也是根据事件流程一步步地向下执行。而「钩子」的意思,就是在事件传送到终点前截获并监控事件的传输,像个钩子钩上事件一样,并且能够在钩上事件时

JS的事件冒泡和事件捕获

什么是事件?事件是文档和浏览器窗口中发生的特定的交互瞬间。事件是javascript应用跳动的心脏,也是把所有东西黏在一起的胶水,当我们与浏览器中web页面进行某些类型的交互时,事件就发生了。事件可能是用户在某些内容上的点击,鼠标经过某个特定元素或按下键盘上的某些按键,事件还可能是web浏览器中发生的事情,比如说某

Android的消息循环与Handler机制理解

一、概念1、事件驱动型什么是事件驱动?就是有事了才去处理,没事就躺着不动。假如把用户点击按钮,滑动页面等这些都看作事件,事件产生后程序就执行相应的处理方法,就是属于事件驱动型。2、消息循环把需要处理的事件表示成一个消息,并且把这个消息放入一个队列。消息循环就是一循环,for或者while都一样。从消息队列里面取出未处理的消息,然后调用该消息的