微信公众号 讲师中心
首页
文章
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 自媒体 新闻
专题
后端开发 web前端 数据库 开发工具 php框架 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 新闻
AI工具
AI 聊天问答 Agent智能体 AI 文本写作 AI 绘画作图 AI 设计工具 AI 视频创作 AI 音频制作 AI 办公学习 AI 编程开发 Prompt指令
学习
大前端 后端开发 数据库 移动端 运维开发 计算机基础
编程手册
大前端 后端开发 数据库 移动端 运维开发 计算机基础
下载
js特效 网站源码 工具下载 类库下载 网站素材 学习资源 插件扩展 手机/移动开发 手机游戏
最近更新
搜索
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程
自媒体 新闻
首页 > web前端 > js教程 > 正文

各浏览器对link标签onload/onreadystatechange事件支持的差异分析_javascript技巧

php中文网
发布： 2016-05-16 18:07:29
原创
1646人浏览过

1，onload事件

复制代码 代码如下:





Link Element onload






IE6/7 :

各浏览器对link标签onload/onreadystatechange事件支持的差异分析_javascript技巧

IE8/9 :

各浏览器对link标签onload/onreadystatechange事件支持的差异分析_javascript技巧

Opera :

各浏览器对link标签onload/onreadystatechange事件支持的差异分析_javascript技巧

Creatext AI
Creatext AI

专为销售人员提供的 AI 咨询辅助工具

Creatext AI 39
查看详情 Creatext AI

即IE6/7/8/9/Opera都支持onload事件， Firefox/Safari/Chrome不支持。

注：用JS创建link标签再添加到head中，情况如上。
2，onreadystatechange事件

复制代码 代码如下:





Link Element onreadystatechange






IE6/7/8/9中弹出了两次，其它浏览器均没有弹。说明只有IE支持link元素的onreadystatechange事件。弹出两次分别是readyState为loading，complete状态。可使用readyState来判断载入情况。我们再使用JS动态创建link元素试试，
复制代码 代码如下:





Link Element onreadystatechange


<script> <BR>function createEl(type, attrs){ <BR>var el = document.createElement(type), <BR>attr; <BR>for(attr in attrs){ <BR>if(attrs.hasOwnProperty(attr)){ <BR>el.setAttribute(attr, attrs[attr]); <BR>} <BR>} <BR>return el; <BR>} <BR>var link = createEl('link', { <BR>href : 'http://i3.sinaimg.cn/rny/webface/login/css/login101021_min.css', <BR>rel : 'stylesheet', <BR>type : 'text/css' <BR>}); <BR>link.onreadystatechange = function(){ <BR>alert(this) <BR>} <BR>document.getElementsByTagName('head')[0].appendChild(link); <BR></script>



IE6/7/8/9中仍然弹出了2次。Firefox/Safari/Chrome仍然没弹。貌似一切正常，但神奇的是这次在Opera中弹出了一次，说明Opera支持动态创建link元素时的onreadystatechange事件。

相关：

https://developer.mozilla.org/en/HTML/Element/link
http://msdn.microsoft.com/en-us/library/ms535848%28v=VS.85%29.aspx
http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/level-one-html.html#ID-35143001

大家都在看：

java速学教程(入门到精通)
java速学教程(入门到精通)

java怎么学习？java怎么入门？java在哪学？java怎么学才快？不用担心，这里为大家提供了java速学教程(入门到精通)，有需要的小伙伴保存下载就能学习啦！

下载
来源：php中文网
收藏 点赞
上一篇：jQuery判断元素是否是隐藏的代码_jquery 下一篇：让浏览器非阻塞加载javascript的几种方法小结_javascript技巧
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
最新问题
JavaScript静态方法_类静态成员 静态方法和属性属于类本身，通过static定义并直接用类名调用。如MathUtils.add()和Counter.count，不依赖实例，this指向类，适用于工具函数、计数器等场景，提升代码组织性。
2025-11-30 17:29:20
965
JavaScript工程化_Webpack构建优化 优化Webpack构建需从减小体积、提升速度、改善体验和增强稳定性入手，通过TreeShaking、代码分割、压缩混淆、按需加载降低产物体积；利用缓存、限制loader范围、多进程构建加速编译；结合SourceMap、HMR、DevServer优化开发调试；并通过配置分离、产物分析、版本锁定保障可维护性。
2025-11-30 17:25:02
375
服务端JavaScript_Koa中间件机制 Koa中间件采用洋葱模型，通过async/await和next()实现请求的双向控制流。1.中间件函数接收ctx和next，依次执行前置逻辑、调用next进入下一层、执行后置逻辑；2.多个中间件按注册顺序形成“外进内出”结构，如示例中输出“进入1→进入2→退出2→退出1”；3.典型应用包括日志记录、错误捕获（用try/catch包裹next）、权限校验、CORS等；4.错误处理中间件需置于顶层，捕获后续所有异常并统一响应。核心在于理解next()返回Promise及洋葱模型的嵌套执行机制。
2025-11-30 16:35:49
810
JavaScript解析器_递归下降算法实现 递归下降解析通过递归函数实现语法分析，将语法规则转为函数，配合词法分析器生成AST，适用于JavaScript表达式解析，需避免左递归并支持错误处理与位置追踪。
2025-11-30 16:05:02
829
JavaScript并发控制_异步任务调度算法 并发控制是限制同时执行的异步任务数量，通过Scheduler类或asyncPool函数实现，确保系统资源不被耗尽，提升稳定性和性能。
2025-11-30 16:00:11
224
JavaScript函数组合_Compose实现方法 函数组合是将多个函数串联，前一个输出作为下一个输入。在JavaScript中，compose函数通过reduceRight实现从右到左执行，如compose(f,g)(x)等价于f(g(x))；支持异步时可用async/await顺序处理；与pipe不同，后者从左到右执行，更直观但非数学定义的组合。掌握compose有助于写出更清晰、可复用的函数式代码。
2025-11-30 15:29:33
532
JavaScript中无数据库实现URL参数短链的策略与实践 本文探讨在JavaScript环境中，不依赖数据库实现URL参数短链的两种主要策略。我们将分析Gzip结合Base64编码的局限性，并重点介绍如何通过设计应用特定的自定义压缩编码方案，高效地将冗长的URL参数转换为简洁的短字符串，同时提供编码与解码的实现思路，适用于需要内存级解决方案的场景。
2025-11-30 15:18:11
871
JavaScript中将JSON对象数组转置为键值数组映射的实用指南 本教程详细介绍了如何在JavaScript中将一个包含多个JSON对象的数组转换为一个键值映射对象，其中每个键对应一个属性名，其值则是一个包含所有原始对象中该属性值的数组。文章将通过一个简洁高效的函数实现这一转置操作，并提供代码示例，帮助开发者理解并掌握这种常见的数据结构转换技巧，从而提升数据处理的灵活性和效率。
2025-11-30 15:17:47
846
优化动态内容注入：解决Body标签导致的累积布局偏移（CLS）问题 当Lighthouse或PageSpeedInsights报告标签是累积布局偏移（CLS）的主要贡献者时，这通常意味着页面中存在大量动态注入的HTML内容导致了布局不稳定。本教程将深入探讨此类问题的根源，并提供一系列实用的策略和技术，帮助开发者有效识别、最小化并优化动态内容注入，从而显著提升页面性能和用户体验。
2025-11-30 15:17:01
968
解决Express.js中PUT请求更改用户密码失败的问题：路由参数的重要性 本文探讨了Express.js应用中，当使用PUT请求更新用户密码时出现500内部服务器错误，而POST请求却能正常工作的常见问题。核心原因在于PUT请求的路由定义缺少了动态参数。教程详细解释了RESTfulAPI中PUT请求的语义，并通过示例代码展示了如何在路由路径中添加如/:id这样的参数来解决此问题，确保Express.js能够正确匹配和处理更新操作，从而实现密码安全有效地修改。
2025-11-30 15:15:33
296
相关专题
更多>
热门推荐
开源免费商场系统广告
热门教程
更多>
相关推荐
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网：公益在线php培训，帮助PHP学习者快速成长！
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • PHP学习

  • 技术支持

  • 返回顶部