addLoadEvent函数】的更多相关文章

在给网页加一些特效时经常要在<body>中加入“onload”事件,即在网页加载完后执行某事件,例如:<body onload=”alert(‘欢迎光临!')”,但这样做有个大的缺陷,事件会在网页完全下载完后才会执行,包括网页中的图片或Flash等,如果网页中的图片比较大或有很多图,可能还没等网页完全下载完网友已经点击链接到其它网页去了,这样这个事件就没有执行了.另外在某些特殊情况下可能还修改不了网页的body参数.如在别人网站发表文章时,或用CMS整站系统时. 这时我们会想到用“win…
onload事件是HTML DOM Event 对象的一个属性,又叫事件句柄(Event Handlers),它会在页面或图像加载完成后(注意是加载完成后)立即发生. window.onload = func的作用就是在页面加载完成后将func函数绑定到onload事件上并执行.如果页面加载完成之后,只需要执行一个函数func,那么只用window.onload = func也就可以了,但是如果需要执行两个甚至多个函数呢? 直接调用两次onload不就行了: window.onload=firs…
首先是addLoadEvent函数的代码清单: function addLoadEvent(func){    var oldonload=window.onload;    if(typeof window.onload!='function')    {        window.onload=func;    }    else    {        window.onload=function()        {            oldonload();          …
先贴源码 function addLoadEvent(func) { var oldonload = window.onload; //存入当前onload事件 if(typeof window.onload != 'function') { window.onload = func; //如果当前onload事件不是函数,则直接执行func } else { window.onload = function() { oldonload(); //继续之前的onload事件的函数 func();…
一.共享onload事件 这个函数的名字是addLoadEvent,它是由Simon Willison 编写的.它只有一个参数:打算在页面加载完毕时执行的函数的名字. 下面是addLoadEvent函数将要完成的操作. ·把现有的window.onload事件处理函数的值存入变量oldonload. ·如果在这个处理函数上还没有绑定任何函数,就像平时那样把新函数添加给它. ·如果在这个处理函数上已经绑定了一些函数,就把新函数追加到现有指令的末尾. 下面是addLoadEvent函数的代码清单:…
为了让函数只在页面加载完毕后才得到执行,我们会把函数绑定到onload事件上: window.onload = userFunction 但如果有两个函数:firstFunction() 和 secondFunction(),都想让它们在页面加载完毕后得到执行,该怎么办?如果这样:      window.onload = firstFunciton;      window.onload = secondFunction; 只有最后一个函数能被执行.由此可得:每个事件处理函数只能绑定一条指令.…
addLoadEvent函数: 众所周知,html文档加载完后会立即执行一个onload函数.但是onload函数只能包含一个被执行的函数,也就是你需要在加载完文档后执行的一个自己的函数.在实际中html加载完成后需要执行很多预先执行的函数,那么怎样才能让html文档加载完后执行很多自己的函数呢? 1. 最简单的方法:回调 window.onload = function(){ function1(); function2(); } 2.另一种解决办法: function addLoadEven…
预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布,也可帮助用户在浏览你网站内容时获得更好的用户体验.本文将分享三个不同的预加载技术,来增强网站的性能与可用性. 方法一:用CSS和JavaScript实现预加载 实现预加载图片有很多方法,包括使用CSS.JavaScript及两者的各种组合.这些技术可根据不同设计场景设计出相应的解决方案,十分高效.…
这本书是一本很基础的书,但对于刚入前端不久的我来说是一本不错的书,收获还是很大的,对一些基础的东西理解得更加透彻了. 1.DOM即document object model的缩写,文档对象模型,JavaScript做的就是对DOM的操作,或者说对节点(node)的操作. 2.js中DOM.this这是都是对象,有属性有方法. 3.document对象有body属性,所以可以直接写成document.body,无需再获取body元素(document.getElementsByTagName("b…
预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布,也可帮助用户在浏览你网站内容时获得更好的用户体验.本文将分享三个不同的预加载技术,来增强网站的性能与可用性.方法一:用CSS和JavaScript实现预加载实现预加载图片有很多方法,包括使用CSS.JavaScript及两者的各种组合.这些技术可根据不同设计场景设计出相应的解决方案,十分高效.单纯…
在做前端工作中,我们想要设置某个函数prepare,让它在网页加载完毕后执行,会触发一个onload事件,这个事件与windows对象相关联,必须把prepare函数绑定到这个时间上,语法如下:window.onload=prepare; 这个方法可以解决我的问题,但是,如果我有两个函数firstfunc和secondfunc,我想让他们两个都在页面加载完成后得到执行,我该怎么做呢? window.onload=firstfunc; window.onload=secondfunc; 像这样逐一…
第五章 最佳实践 平稳退化(graceful degradation):如果正确使用了JavaScript脚本,可以让访问者在他们的浏览器不支持JavaScript的情况下仍能顺利地浏览你网站.虽然某些功能无法使用,但是最基本的操作仍能顺利完成 window.open(url,name,features); 打开一个新的窗口 这个函数是使用BOM的好案例url 新窗口的链接name 新窗口的名字 代码里边可以通过这个name和新窗口通信features 新窗口的各种属性 比如尺寸 或者被启用或者…
动态创建标记 一些传统方法 document.write document.write()方法可以方便快捷的把字符串插入到文档里. 请把以下标记代码保存为一个文件,文件名就用test.html 好了. <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>Test</title> </head>…
案例研究:图片库改进版 我们在学校里学过一种理论,叫做结构化程序设计.其中有这样一条原则:函数应该只有一个入口和一个出口.从理论上讲,我很赞同这项原则:但在实际工作中,过分拘泥于这项原则往往会使代码变得非常难以阅读.如果为了避免留下多个出口点而去改写那些if语句的话,这个函数的核心代码就会被掩埋在一层又一层的花括号里,就像下面这样: function prepareGallery(){ if (document.getElementsByTagName){ if (document.getEle…
学习jQuery的第一件事是:如果你想要一个事件运行在你的页面上,你必须在$(document).ready()里调用这个事件 学习jQuery的第一件事是:如果你想要一个事件运行在你的页面上,你必须在$(document).ready()里调用这个事件.所有包括在$(document).ready()里面的元素或事件都将会在DOM完成加载之后立即加载,并且在页面内容加载之前.  If you want an event to work on your page, you should call…
预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画 廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布,也可帮助用户在浏览你网站内容时获得更好的用户体验.本文将分享三个不同的预加 载技术,来增强网站的性能与可用性. 方法一:用CSS和JavaScript实现预加载 实现预加载图片有很多方法,包括使用CSS.JavaScript及两者的各种组合.这些技术可根据不同设计场景设计出相应的解决方案,十分高…
第1章 javascript简史 1.什么是DOM? 简单的说,DOM是一套对文档的内容进行抽象和概念化的方法.\         第2章 javascript语法 1.内建对象: 内建在javascript语言里的对象.(可以new出来的)   2.宿主对象: 由浏览器提供的预定义对象称为宿主对象.         第3章 DOM 1.getElementById(): 使用getElementById()方法,返回一个与那个有着给定ID属性值的元素节点对应的对象,该方法的参数就是指定的ID,…
问题:通过js进行事件绑定,必须在HTML文档加载完成后再执行js脚本,否则可能因DOM不完整导致无法完成预计的效果,但对于不同的需求如何选用最佳的实现方式呢,这里做了整理,可以做参考. 一.对于小型的网页,可以直接用下面的代码绑定即可: window.onload = func; 二.在复杂的一些可以用: window.onload = function(){ func1(); func2(); func3(); } 在需要绑定的函数不太多的场合,这是最简单的解决方案. 三.对于复杂场合,则需…
预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布,也可帮助用户在浏览你网站内容时获得更好的用户体验.本文将分享三个不同的预加载技术,来增强网站的性能与可用性. 方法一:用CSS和JavaScript实现预加载 实现预加载图片有很多方法,包括使用CSS.JavaScript及两者的各种组合.这些技术可根据不同设计场景设计出相应的解决方案,十分高效.…
Chapter 0 为什么读这本书?作为js入门书,补基础,由于本书代码demo较简单,并没有贴代码,只记录一些自己要注意的知识点以及代码脚本 Chapter 1: javascript简史 DOM全称是document object model(文档对象模型),假设把文档看做一个对象,那DOM就是如何利用HTML和XML去对这个对象进行操作和控制的标准 1.2 AJAX(异步传输技术)引发了一次学习DOM脚本编程的热潮: 传统的Web应用交互由用户出发一个HTTP请求到服务器,服务器对其进行处…
终于开始接着写我的读书笔记了. 17.DOM有insertBefore方法,但并没有提供insertAfter()方法.不过可利用已有的DOM方法和属性编写此函数: function insertAfter(newElement, targetElement) { var parent = targetElement.parentNode; if(parent.lastChild == targetElement) { parent.appendChild(newElement); }else{…
预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布,也可帮助用户在浏览你网站内容时获得更好的用户体验.本文将分享三个不同的预加载技术,来增强网站的性能与可用性. 方法一:用CSS和JavaScript实现预加载 实现预加载图片有很多方法,包括使用CSS.JavaScript及两者的各种组合.这些技术可根据不同设计场景设计出相应的解决方案,十分高效.…
前言 有些函数,必须在网页加载完毕后执行.比如:涉及DOM操作的. 网页加载完毕时会触发一个onload事件,将函数绑定到这个事件上即可. window.onload = myFunction; 问题来了:如果需要同时绑定多个事件,该如何处理呢?有两种解决方法 方案一 创建一个匿名函数,来容纳需要绑定的多个事件,再讲这个匿名函数绑定到onload事件上 window.onload = function(){ firstFunction(); secondFunction(); ...... }…
预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布,也可帮助用户在浏览你网站内容时获得更好的用户体验.本文将分享三个不同的预加载技术,来增强网站的性能与可用性. 方法一:用CSS和JavaScript实现预加载 实现预加载图片有很多方法,包括使用CSS.JavaScript及两者的各种组合.这些技术可根据不同设计场景设计出相应的解决方案,十分高效.…
  js自定义封装方法 CreateTime--2016年10月16日15:18:18Author:Marydon 声明:该文章主要是记录了需要使用javascript实现对日常需要的方法进行封装,封装方法大部分都是百度解决的,(这里只是针对我用到的做个汇总),特此声明! 使用方法:将需要的方法复制到<script>标签体中,在下面直接调用对应的方法即可一.自定义js的添加&移除类名方法 参考链接--http://www.cnblogs.com/kuikui/archive/2011/…
以一个简单的web程序为例 详细设计模式请配合代码及凝视食用 <!DOCTYPE html> <!-- 1 预留退路:假设用户禁用了js.链接还能正常显示吗?(href) 2 分离js:行为层与结构层真的分开且互不干扰吗?(onclick) 3 向后兼容:js代码中检測了浏览器的函数支持吗?(if(!xxx)return) --> <html lang="en"> <head> <meta charset="UTF-8&q…
function addLoadEvent(func){ var oldonload = window.onload; if(typeof window.onload != "function"){ window.onload = func; } else{ window.onload = function(){ oldonload(); func(); } } } 此函数由Simon Willison (详见http://simon.incutio.com) 编写. 它只有一个参数:…
http://www.dustindiaz.com/top-ten-javascript/     发布:wpulog | 发布时间: 2010年4月9日 10个被使用的最普遍的用户自定义函数,addEvent(),addLoadEvent(),getElementsByClass(),getCookie(),setCookie(), deleteCookie()等. 10) addEvent()   function addEvent(elm, evType, fn, useCapture)…
function addLoadEvent(func) { var oldonload = window.onload; if (typeof window.onload != 'function') { window.onload = func; } else { window.onload = function() { if (oldonload) { oldonload(); } func(); } } } func参数就是要加载的函数名(记得只是函数名,不需要括号),有多少个函数需要在页…
1 HTML的事件属性  全局事件属性:HTML 4 增加了使事件在浏览器中触发动作的能力,比如当用户点击元素时启动 JavaScript. a. Window 事件属性,针对 window 对象触发的事件(应用到 <body> 标签),常用的为onload. b. Form事件,由 HTML 表单内的动作触发的事件(应用到几乎所有 HTML 元素,但最常用在 form 元素中):常用的为onblur.onfocus.onselect.onsubmit. c. keybord事件 d.Mous…