Iframe自适应高度
<script language="JavaScript">
//** iframe自动适应页面 **//
//输入你希望根据页面高度自动调整高度的iframe的名称的列表
//用逗号把每个iframe的ID分隔. 例如: ["myframe1", "myframe2"],可以只有一个窗体,则不用逗号。
//定义iframe的ID
var iframeids=["content"]
//如果用户的浏览器不支持iframe是否将iframe隐藏 yes 表示隐藏,no表示不隐藏
var iframehide="yes"
function dyniframesize()
{
var dyniframe=new Array()
for (i=0; i<iframeids.length; i++)
{
if (document.getElementById)
{
//自动调整iframe高度
dyniframe[dyniframe.length] = document.getElementById(iframeids[i]);
if (dyniframe[i] && !window.opera)
{
dyniframe[i].style.display="block"
if (dyniframe[i].contentDocument && dyniframe[i].contentDocument.body.offsetHeight) //如果用户的浏览器是NetScape
dyniframe[i].height = dyniframe[i].contentDocument.body.offsetHeight;
else if (dyniframe[i].Document && dyniframe[i].Document.body.scrollHeight) //如果用户的浏览器是IE
dyniframe[i].height = dyniframe[i].Document.body.scrollHeight;
}
}
//根据设定的参数来处理不支持iframe的浏览器的显示问题
if ((document.all || document.getElementById) && iframehide=="no")
{
var tempobj=document.all? document.all[iframeids[i]] : document.getElementById(iframeids[i])
tempobj.style.display="block"
}
}
}
if (window.addEventListener)
window.addEventListener("load", dyniframesize, false)
else if (window.attachEvent)
window.attachEvent("onload", dyniframesize)
else
window.onload=dyniframesize
</script>
将文档设置为设计模式
要将整个文档设置为设计模式,可以对文档对象本身设置 designMode 属性。当文档处于设计模式时,将不运行脚本。这样,似乎在文档内设置一个按钮来打开或关闭设计模式是个好注意,但这样做没有作用。当用户打开它后,它将保持在设计模式状态。当他们下次单击此按钮时,它将被选定而不是被单击,他们再次单击它,将能够编辑它的值。这就是为什么如果要使用设计模式最好对框架或 IFrame 中的文档设置 designMode 属性的原因。下例展示如何为 IFrame 中的文档打开设计模式:
<script for="btnDesign" event="onclick">
targetDoc = document.frames(0).document;
if (targetDoc.designMode == "On")
targetDoc.designMode = "Off";
else
targetDoc.designMode = "On";
</script>
<button
<iframe src="blank.htm" style="border: black thin; width:100%; height:200px"></iframe>
designMode 属性的值始终以首字母大写格式存储,即时它最初是以全部小写设置的。请在测试它的值时一定记住这点。designMode 属性的默认值是“Inherit”。
contentEditable
IE5.0以上版本有一个编辑状态,designMode是document的属性,意思是设置或获取表明文档是否可被编辑的值,默认值为off或Inherit
HtmlEdit.document.designMode="On";
HtmlEdit是iframe对象ID
IE 中可以设置contentEditable="true"
把div的contentEditable属性设置为 true,在IE浏览器中就可以看到效果了,div中元素都变成可以编辑的了。
<div id="tt" contentEditable="true">
</div>
<body contentEditable="true"> 则整个页面都可以编辑了。
Firefox中可以 使用javascript语句设置属性contentDocument.designMode为 "on"
iframeName.document.designMode="on" ;
其中iframeName 为iframe控件的name属性。
在 IE7和 FireFox2.0中测试通过
相关推荐
在Firefox中,可以通过JavaScript设置`contentDocument`的`designMode`来达到类似的效果: ```javascript iframeName.document.designMode = "on"; ``` 这里,`iframeName`是`iframe`控件的`name`属性。 然而,...
`document.designMode` 是一个非常有用的特性,主要应用于网页开发中,允许开发者开启或关闭页面元素的可编辑性。这个属性允许用户直接在浏览器中编辑HTML内容,类似于一个简单的在线文本编辑器。以下是对 `document...
`contentWindow` 和 `contentDocument` 是两个非常重要的JavaScript属性,它们用于在iframe之间进行通信和操作。 `contentWindow` 是一个对象,它代表了嵌入在iframe中的窗口,即子窗口的`window`对象。通过这个...
除了简单的元素操作外,还可以利用`designMode`和`contentEditable`属性来重写`iframe`中的内容,使之成为可编辑状态。 ```javascript var iObj = document.getElementById('iId').contentWindow; iObj.document....
在IT领域,特别是前端开发中,JavaScript(简称JS)被广泛用于实现网页的动态功能,包括页面跳转和对iframe内的页面进行跳转与刷新。本文将深入解析JS页面跳转的各种方法,以及如何利用JS操作iframe进行页面跳转和...
`javascript`提供了解决这个问题的方案,即动态调整`iframe`的高度,确保内容完整显示,同时保持页面整洁美观。下面我们将详细探讨如何使用`javascript`来实现这一功能。 1. 获取`iframe`元素 在`javascript`中,...
在JavaScript(js)中实现打印和预览功能是一项常见的需求,尤其在Web开发中。本文将详细介绍如何基于JavaScript实现这一功能,并确保其在IE、Firefox和Google等主流浏览器中的兼容性。 首先,我们需要理解...
在网页开发中,JavaScript(简称JS)是一种广泛使用的客户端脚本语言,用于增强用户的交互体验。其中,"js调用-嵌入iframe"是JS在处理页面元素,特别是与IFrame(内联框架)交互时的一个重要技术。IFrame允许在单一...
在IT行业中,动态创建iframe和动态添加JavaScript代码是一种常见的技术,尤其在页面加载后需要异步加载内容或者实现跨域通信时。以下是对这个主题的详细讲解。 首先,`iframe`(Inline Frame)是HTML中的一种元素,...
document.getElementById('myEditer').contentDocument.designMode = 'on'; ``` 接着,我们要实现选中文本的功能。在JavaScript中,我们可以利用`document.selection.createRange()`方法来选取文本,并通过`sel....
在JavaScript(JS)中,`iframe`是一种非常有用的元素,它允许我们在一个页面中嵌入另一个页面。这种技术常用于加载外部内容、实现页面部分刷新、或者在不同域之间进行跨域通信。本文将深入探讨如何使用JS与`iframe`...
在JavaScript(JS)中,利用iframe进行打印和打印预览是常见的需求,特别是在网页开发中。这个场景下,我们可能需要自定义页眉和页脚,以提供更专业的打印效果。下面将详细介绍如何通过JS实现这个功能。 首先,我们...
frame.contentDocument.designMode = 'on'; } ``` 3. **多层嵌套**:`iframe`支持多层嵌套,这意味着一个`iframe`内可以再嵌入另一个`iframe`,实现更复杂的页面布局和功能。 4. **兼容性问题**:需要注意的...
这个“js操作iframe的一些知识”主题涵盖了如何利用JavaScript与iframe进行交互,包括创建、访问、修改以及通信等多个方面。下面我们将深入探讨这些关键知识点。 1. **创建iframe**:首先,你需要在HTML中声明一个...
在IT行业中,JavaScript(简称JS)是一种广泛使用的脚本语言,尤其在网页开发中起着至关重要的作用。"js.zip_iframe"这个标题暗示我们,这里涉及到的是一个使用JavaScript技术来实现的压缩包,其中可能包含了一个...
获取Iframe内容的关键在于JavaScript的`contentWindow`或`contentDocument`属性。在非跨域情况下,可以通过以下方式访问: 1. `contentWindow`: 对于支持DOM操作的浏览器(如FF),`contentWindow`属性可以直接访问...
在Java Web应用开发中,JavaScript(JS)是客户端编程的核心技术,它负责处理用户交互、动态更新内容以及与服务器进行异步通信。本资源“Java Web应用客户端编程JS经典事例”显然是一份涵盖多种JS实用技巧和示例的...
在JavaScript(JS)中,页面刷新是常见的操作,主要用于更新页面内容或重新加载页面数据。在Web开发中,我们有时需要实现自动刷新、特定条件下刷新、或者通过子窗口控制父窗口的刷新。以下是对这些方法的详细介绍: ...
JavaScript(简称JS)是一种广泛用于网页和网络应用的编程语言,尤其在操作DOM(文档对象模型)方面具有强大的功能。当涉及到在iframe中操作DOM时,情况会变得稍微复杂一些,因为iframe实际上是一个独立的浏览上下文...