Dom2(页面加载事件,标签样式,刷新)_html动态加载的dom刷新-优快云博客

本文链接：https://blog.youkuaiyun.com/xbc1213/article/details/50555552

这篇博客探讨了页面加载事件，包括onload、onunload和onbeforeunload三种类型，强调了它们触发的时机，并提供了相关案例。此外，文章还介绍了如何使用标签选择器进行样式设置，以及通过location.reload()实现页面刷新。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

页面加载事件

主要有3种:
第一种:onload
页面加载完毕时触发,浏览器是一边下载文档,一边解析执行,可能会出现会出现JavaScript执行时需要操作的参数还没有加载.如果这样,就要把操作的文档放到body的onload事件中,或者把JavaScript放到元素之后.元素的onload事件是元素自己加载完毕时触发,body onload才是全部加载完成.
案例:

onload=function(){
    alert('加载后执行');  
      };

小知识点:推荐采用doucument.getElementById(‘控件id’)的方法获取指定控件

第二种:onunload
页面卸载后触发,网页关闭(或者离开)后触发.刷新页面的时候.关闭选项卡的时候(多个选项卡)

onunload=function(){
    alert('我是在什么时候执行的呢?');  
  };

第三种:onbeforeunload(页面卸载前触发)
在网页准备关闭(或者离开)前触发,可以删除浏览器的缓存

onbeforeunload=function(){
    alert('我要关闭了'); 
    };

知识点:标签选择器

该标签选择器的内容可以直接写在div里面,style.写法格式如下.
实例:

<style type='text/css'>
  /*标签选择器*/
  div
  {
  /*边框 中间不写空格 实心的*/
  border:2px yellow solid;
  width:200px;
  height:150px;
  }
  </style>

这里将设置所有的div都是这个样式.

设置页面的边距和元素边距
实例:

<body style='margin:0;padding:0;'>
  <input type='button' name='name' value='我是按钮,我骄傲' />
  <!--这里讲了点div的标签-->
  <div>
哈哈
  </div>
 </body>

其实margin设置的元素和元素之间的距离.padding是元素和里面内容的距离.

刷新页面

location.reload();可以直接刷新当前页面
实例:

dad=function(){  
    location.reload();  
    alert('刷新完毕,请首长指示');
  };