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

<!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. 安装npm及cnpm

    一.安装npm 1. 使用npm首先需要下载node.js 进入nodejs官网nodejs下载,如下图 : 选择适合自己的系统,我这里使用的是window10 64bit 2. 开始安装 **选好需 ...

  2. const 与define 创建符号常量的 用法与区别

    一.define 的用法: 在c语言中我经常会看到 :#define  PI  12 ,这是创建了一个符号常量,这里面要注意没有那个等于号“=”: 二.const 的用法: 1.const 也可以来创 ...

  3. 跑monkey前开启/关闭系统通知栏

    @echo off cls title 别忘了跑monkey啊 :menu cls color 0A echo. .禁用systemui并重启 echo. .启用systemui并重启 echo. e ...

  4. [Objective-C语言教程]数据类型(5)

    在Objective-C编程语言中,数据类型是指用于声明不同类型的变量或函数的扩展系统. 变量的类型决定了它在存储中占用的空间大小以及如何解释存储的位模式. Objective-C中的类型可分为以下几 ...

  5. NSUserDefault存储类

    类要实现NSCoding协议 实现encodeWithCoder和initWithCoder方法 先把类的instance archive成NSData,然后存起来 TGTest *tt = [TGT ...

  6. Vue页面加载时,触发某个函数的方法

    需要在加载页面的时候调用生成验证码的click事件函数 解决方法如下,利用Vue中的mounted mounted:function(){ this.createcode();//需要触发的函数 } ...

  7. php 多字节编码转换

    PHP 支持的编码 mb_convert_encoding — 转换字符的编码 string mb_convert_encoding ( string $str , string $to_encodi ...

  8. [原创]SSH密钥访问Git仓库配置

    SSH密钥并非为了解决拉取git仓库代码时,需要频繁输入密码的问题. SSH是一种比较安全的协议,可以用来免去远程登录Linux等服务器时需要输入密码的繁琐过程. 命令: ssh user@serve ...

  9. 转:五年java人的一点感悟

    转自:五年java人的一点感悟 恍然间,发现自己在这个行业里已经摸爬滚打了五年了,原以为自 己就凭已有的项目经验和工作经历怎么着也应该算得上是一个业内比较资历的人士了,但是今年在换工作的过程中却遭到了 ...

  10. XNA 中3D模型的显示

    XNA 中3D模型的显示: ModelMeshPart[] meshParts; Model start_model; Matrix[] dq_model_transforms; Matrix vie ...