JS iFrame 加载慢怎么解决
在项目中经常要动态添加iframe,然后再对添加的iframe进行相关操作,有时候会遇到iframe加载很慢什么原因呢,该如何解决呢?带着这个问题一起通过本文学习,寻找答案吧!
aaa.html
<HTML>
<HEAD>
<TITLE>aaa</TITLE>
</HEAD>
<BODY>
<IFRAME src="bbb.html" name=bbb width="100%" height="190"> </IFRAME>
<INPUT type="button" value="显示text控件值" onclick="alert(bbb.document.all.txt.value)">
<SCRIPT LANGUAGE="JavaScript">
alert(bbb.document.all.txt.value);
</SCRIPT>
</BODY>
</HTML>
bbb.html
<HTML>
<HEAD>
<TITLE>bbb</TITLE>
</HEAD>
<BODY>
<input type=text name=txt value="guoguo">
</BODY>
</HTML>
问题:
执行上面的aaa.html发现代码直接alert的值没有打出来,而点击按钮却可以打出其值。注意要放在服务器上运行。
分析:
页面加载时,遇到iframe就直接跳过去,加载下面的内容,然后再回来加载iframe,当然也可以理解成遇到iframe又开了一个线程来加载iframe,但是因为涉及到新的IO操作比较耗时,所以加载完成iframe还是晚于页面下部的js代码执行,所以出现了上面的问题。
解决方法:
在js代码中加个延迟(具体延迟多长时间可以凭个人经验了),这样就可以保证正常得到iframe中的对象了。
<SCRIPT LANGUAGE="JavaScript">
setTimeout("alert(bbb.document.all.txt.value)",1500);
</SCRIPT>
结论:当一个页面中包含了iframe时,如果我们要通过js来操作iframe中的对象,一定要等到iframe加载完毕之后再操作,否则得不到想要的对象。
JS iFrame 加载慢怎么解决的更多相关文章
- iframe中使用模态框提交表单后,iframe加载父页面的解决方法
在iframe中使用模态框提交表单后,会出现iframe加载整个父页面的问题,如下图: 解决方法: 在form表单中添加target属性 _parent 这个属性会使目标文档载入父窗口或者包含来超链接 ...
- 记录Js动态加载页面.append、html、appendChild、repend添加元素节点不生效以及解决办法
今天再优化blog页面的时候添加了个关注按钮和图片,但是页面上这个按钮和图片时有时无,本来是搞后端的,被这个前端的小问题搞得抓耳挠腮的! 网上各种查询解决方案,把我解决问题的艰辛历程分享出来,希望大家 ...
- 转:web前端面试题合集 (Javascript相关)(js异步加载详解)
1. HTTP协议的状态消息都有哪些? 1**:请求收到,继续处理2**:操作成功收到,分析.接受3**:完成此请求必须进一步处理4**:请求包含一个错误语法或不能完成5**:服务器执行一个完全有效请 ...
- 也说JS脚本加载控制
问题背景 前端采用的 iframe + html 做后台管理系统.现在js.jquery插件非常多,每次页面都是引用就类似这样: <script src="../Scripts/jqu ...
- js 动态加载事件的几种方法总结
本篇文章主要是对js 动态加载事件的几种方法进行了详细的总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助 有些时候需要动态加载javascript事件的一些方法往往我们需要在 JS 中动态添 ...
- 判断iframe加载完成
一.js判断 var parFrame = document.getElementById("oIframe"); if(parFrame.attachEvent){ parFra ...
- 前端设计中关于外部js文件加载的速度优化
在一般情况下,许多人都是将<script>写在了<head>标签中,而许多浏览器都是使用单一的线程来加载js文件的,从上往下,从左往右. 若是加载过程出错,那么网页就会阻塞,就 ...
- nodejs js模块加载
本文地址:http://www.cnblogs.com/jasonxuli/p/4381747.html nodejs的非核心模块(core module)加载主要使用的就是module.js. 项目 ...
- ie6,7下js动态加载图片不显示错误
ie6,7下js动态加载图片不显示错误 先描述一下出现这种匪夷所思bug的背景: 我在页面加载的时候加载一堆小缩略图,<a href="javascript:void(0);" ...
随机推荐
- tomcat配置证书
[size=x-small][size=xx-large][size=medium] 1.利用java 生成一个.keystore文件 进入命令行(假设已经设定了环境变量) 执行 keytool -g ...
- PHPCMS 按点击量排序
{pc:content action="hits" catid="12" num="4" order="views DESC&qu ...
- IE8下图片无法显示问题
一.背景图片不能显示的原因 代码: background:url(img/img1.jpg)no-repeat; background:url(img/img1.jpg) no-repeat; 第一个 ...
- .net WebServer示例及调用(接口WSDL动态调用 JAVA)
新建.asmx页面 using System; using System.Collections.Generic; using System.Linq; using System.Web; using ...
- IO流理解方式小结
从业以来一直对IO不甚了解,每次看到都头疼不已,最近有时间小小的总结一下,下面以FileIO流为]; //文件输入流 FileInputStream in = new FileInputStream( ...
- SPARK Day04
广播变量和累加器 广播变量 广播变量理解图 广播变量使用 val conf = new SparkConf() conf.setMaster("local").setAppName ...
- 【python小随笔】函数的初始化与私有化
1:初始化 class test(object): def __init__(self,name):#初始化函数 self.name = name#构造初始化一个变量为类的全局变量, 类的所有函数都可 ...
- ubuntukylin-16.04安装
目录 安装 虚拟机安装 系统安装 vmware tools 安装 优化 1.切换软件源 2.软件源和软件更新 3.vim插件 4.安装Sublime Text 3 5.安装福昕阅读器 6.安装Anac ...
- Java 和 DynamoDB
https://docs.aws.amazon.com/zh_cn/amazondynamodb/latest/developerguide/GettingStarted.Java.html 官方
- bzoj1295 最长距离
Description windy有一块矩形土地,被分为 N*M 块 1*1 的小格子. 有的格子含有障碍物. 如果从格子A可以走到格子B,那么两个格子的距离就为两个格子中心的欧几里德距离. 如果从格 ...