JS是否可以跨文件同时控制多个iframe页面的应用技巧_javascript技巧

有个办法,建议你的有连接的iframe改成include包含的文件,然后记得把文件名改成shtml,或者asp.代码如下:

复制代码 代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>无标题文档</title> 
<meta http-equiv="refresh" content="3;URL=#" /> 
</head> 
<script type="text/javascript"> 
function change(){ 
var a = document.getElementById("iframea"); 
var b = document.getElementById("iframeb"); 
a.setAttribute("src","http://www.163.com"); 
b.setAttribute("src","http://www.sina.com"); 

</script> 
<body> 
<!--#include file="z.html" -->  

<iframe id="iframea" src="http://www.baidu.com/" width="450" height="300"></iframe> 
<iframe id="iframeb" src="http://www.g.cn/" width="450" height="300">></iframe> 

</body> 
</html> 

被包含的文件代码:

<a href="#" onclick="change()">其中内容点击链接更新两个iframe</a><br />

时间: 2024-11-10 07:51:31

JS是否可以跨文件同时控制多个iframe页面的应用技巧_javascript技巧的相关文章

JS组件福利大放送 推荐12款好用的Bootstrap组件_javascript技巧

前言:之前分享过很多bootstrap常用组件,包括表格.表单验证.文件上传.复选下拉框.弹出框等.这段时间,博主又收藏了一些好用的组件(有些在项目中已经用起来了),经过两天的时间,已经整理出了一部分,本着"好东西要与人分享"的原则,今天还是来点福利,将博主收藏的东西分享出来,供需要的园友参考.组件大部分都是些开源组件,也有部分是博主自己在网上找到然后改写出来的效果,可能不尽如人意,有兴趣的且看看吧. 一.时间组件 bootstrap风格的时间组件非常多,你可以在github上面随便搜

无阻塞加载js,防止因js加载不了影响页面显示的问题_javascript技巧

浏览器加载静态资源和js的方式都是线性加载,所以一般情况可以将js放到</body>前,防止UI线程的阻塞. 而某些时候我们既希望js在整个网页的头部就加载,又担心js阻塞导致网站加载缓慢,就可以用到无阻塞加载js技术. Dynamic Script Elements 动态脚本元素 DOM允许我们使用Javascript动态创建HTML的几乎所有文档内容,一个新的<script>元素可以非常容易的通过标准DOM创建: var script = document.createElem

js跨域问题之跨域iframe自适应大小实现代码_javascript技巧

复制代码 代码如下: <body onload="javascript: setHeight();"> <script> function setHeight(){ var dHeight = document.documentElement.scrollHeight; var t = document.createElement("div"); t.innerHTML = '<iframe id="kxiframeagent

js操纵跨frame的三级联动select下拉选项实例介绍_javascript技巧

运用HTML.CSS以及Javascript相关知识,编写多窗口多菜单的内容联动. 考察学生关于frame.浏览器对象,以及表单控件的概念,javascript事件触发机制和程序设计, 以及用CSS来组织文字展示的掌握程度,使学生对DHTML有更加深刻的理解. 实验内容[必做] (1)建立一个包含三个frame的窗口 (2)第一个frame1中包含一个select,内容是中国的各个省 (3)第二个frame2中同样含有一个select,内容是各省的地级市 (4)第三个frame3用来显示关于某地

js控制网页背景音乐播放与停止的方法_javascript技巧

本文实例讲述了js控制网页背景音乐播放与停止的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml

Dropzone.js实现文件拖拽上传功能(附源码下载)_javascript技巧

dropzone.js是一个开源的JavaScript库,提供 AJAX 异步文件上传功能,支持拖拽文件.支持最大文件大小.支持设置文件类型.支持预览上传结果,不依赖jQuery库. 效果演示      源码下载 使用Dropzone 我们可以建立一个正式的上传form表单,并且给表单一个.dropzone的class. <form id="mydropzone" action="/upload.php" class="dropzone"&

js控制li的隐藏和显示实例代码_javascript技巧

html页面 <div class="favorite_list"> <div class="list_type" id="list_type"> <ul class="all"> <li> <a href="javascript:void(0);" onclick="showli(1);">全部(<span class=

js实现按钮控制图片360度翻转特效的方法_javascript技巧

本文实例讲述了js实现按钮控制图片360度翻转特效的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html> <title>js实现按钮控制图片360度翻转特效</title> <body> <script language="javascript"> var isIE = (document.uniqueID)?1:0; var i=1; function rotate(image) { var o

JS实现控制表格行内容垂直对齐的方法_javascript技巧

本文实例讲述了JS实现控制表格行内容垂直对齐的方法.分享给大家供大家参考.具体分析如下: 下面的代码通过表格的vAlign属性控制表格行的内容垂直对齐,可以置顶.可以居中.可以底部对齐 <!DOCTYPE html> <html> <head> <script> function topAlign() { document.getElementById('tr2').vAlign="top"; } </script> <