等待页面都加载完后再执行

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript">

// window.onload=function(){
// alert(exist("getSpanText"));
// alert(exist("111"))
// }

function loadText(){
　　var spanValue = document.getElementById("getSpanText").innerHTML;
　　alert("spanValue = " + spanValue);
　　alert(exist("getSpanText"));
}
function exist(id){
　　var s=document.getElementById(id);
　　if(s){
　　　　return true
　　}
　　else{
　　　　return false
　　}
}

</script>
</head>
<body onload="loadText()">
　　<span id="getSpanText">Jason</span》
</body>
</html>

页面加载之后立即执行一段 JavaScript：

<body onload="load()">

亲自试一试

浏览器支持

IE Firefox Chrome Safari Opera
         

所有主流浏览器都支持 onload 属性。

定义和用法

onload 属性在对象已加载时触发。

onload 常用在 <body> 中，一旦完全加载所有内容（包括图像、脚本文件、CSS 文件等），就执行一段脚本。

HTML 4.01 与 HTML5 之间的差异

无。

语法

<element onload="script">

属性值

值 描述
script onload 发生时运行的脚本。

JS onload 事件

定义和用法

onload 事件会在页面或图像加载完成后立即发生。

语法

onload="SomeJavaScriptCode"
参数 描述
SomeJavaScriptCode 必需。规定该事件发生时执行的 JavaScript。

支持该事件的 HTML 标签：

<body>, <frame>, <frameset>, <iframe>, <img>, <link>, <script>

支持该事件的 JavaScript 对象：

image, layer, window

实例

在本例中，文本 "Page is loaded" 会被显示在状态栏中：

<html>

<head>

<script type="text/javascript">

function load()

{

window.status="Page is loaded"

}

</script>

</head>

<body onload="load()">

</body>

</html>

TIY

onload
如何使用 onload 在页面完成加载时在状态栏显示一段文本。

html/JS onload的详解的更多相关文章

  1. window.onload用法详解:

    网页中的javaScript脚本代码往往需要在文档加载完成后才能够去执行,否则可能导致无法获取对象的情况,为了避免这种情况的发生,可以使用以下两种方式: 一.将脚本代码放在网页的底端,这样在运行脚本代 ...

  2. JS - Promise使用详解--摘抄笔记

    第一部分: JS - Promise使用详解1(基本概念.使用优点) 一.promises相关概念 promises 的概念是由 CommonJS 小组的成员在 Promises/A 规范中提出来的. ...

  3. JS事件类型详解

    一般事件 onclick IE3.N2 鼠标点击时触发 此事件 ondblclick IE4.N4 鼠标双击时触发 此事件 onmousedown IE4.N4 按下鼠标时触发 此事件 onmouse ...

  4. 《Node.js开发实战详解》学习笔记

    <Node.js开发实战详解>学习笔记 ——持续更新中 一.NodeJS设计模式 1 . 单例模式 顾名思义,单例就是保证一个类只有一个实例,实现的方法是,先判断实例是否存在,如果存在则直 ...

  5. Js apply 方法 详解

    Js apply方法详解 我在一开始看到JavaScript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这 ...

  6. ES6,ES2105核心功能一览,js新特性详解

    ES6,ES2105核心功能一览,js新特性详解 过去几年 JavaScript 发生了很大的变化.ES6(ECMAScript 6.ES2105)是 JavaScript 语言的新标准,2015 年 ...

  7. 网站开发进阶(十三)window.onload用法详解

    window.onload用法详解 网页中的javaScript脚本代码往往需要在文档加载完成后才能够去执行,否则可能导致无法获取对象的情况,为了避免这种情况的发生,可以使用以下两种方式: 一.将脚本 ...

  8. Js apply()使用详解

    Js apply方法详解 我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这 ...

  9. Js apply方法详解,及其apply()方法的妙用

    Js apply方法详解 我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这 ...

随机推荐

  1. OCP 052最新考试题库和答案收集-34

    34.Which two can be backed up by using RMAN when a database Is open in ARCHIVELOG mode, so that medi ...

  2. UIImageView笔记

    image的伸缩变换 最好是image和imageview的size一致.如果不一致,最终的效果由imageView的contentMode和image的属性共同决定. 如果image没有cap in ...

  3. 【python】10分钟教你用python如何正确把妹

    前言 今天没妹子约,刚好研究一下.如何用神奇的python打造一个把妹神器吧.看完这个,你们就能走向人生巅峰,迎娶白富美啦. 我知道你们想看看效果 image 当然啦,这只是测试版的效果,真正的版本可 ...

  4. Codeforces Round #545 (Div. 2) 题解

    题目链接 A. Sushi for Two 题意 在一个 01 序列中找出长为偶数的连续的一段使得它前一半和后一半内部分别相同,而前一半和后一半不同. \(2\le n\le 100\ 000\) 题 ...

  5. V1-bug Alpha阶段测试报告

    发现的Bug Bug现象 Bug原因 是否解决 访问到错误的视图 路由正则写的太过宽泛 是 主题太长时超过页面宽度,导致超过顶部的宽度 / 否 无法使用域名访问服务器 后端没有在配置文件的ALLOWE ...

  6. Bellman-Ford(BF)和Floyd算法

    以下只是本人的笔记,想法我自己都怀疑,内容不作为参考, Floyd算法就比较暴力了,算法思想是三重循环,直接枚举所有的顶点,再两次for循环枚举所有点,验证以第一个点为中转点的两个点是否路径更短,具体 ...

  7. epoll_wait 返回值学习以及epoll使用学习

    https://blog.csdn.net/analogous_love/article/details/88721574

  8. BottomSheetDialogFragment 如何设置高度和禁止滑动

    主要是获取dialog 的BottomSheetBehavior 然后设置 setPeekHeight 和 BottomSheetCallback. private BottomSheetBehavi ...

  9. EasyNetQ自定义异常消息处理

    20140310补充: rabbitmq有requeue属性,可以选择消息是否返回队列,另,本文的解决方式非常之山寨,只能应用于发送和接收方式. 这几天在折腾消息队列,在.Net环境下有基于Rabbi ...

  10. PHP和Java中foreach循环的用法区别

    1.foreach语句介绍: ①PHP: foreach 语法结构提供了遍历数组的简单方式.foreach 仅能够应用于数组和对象,如果尝试应用于其他数据类型的变量,或者未初始化的变量将发出错误信息. ...