如何将一个完全不同的HTML文件导入到iframe？
要将一个完全不同的HTML文件导入到iframe，可以通过以下步骤实现：
- 在父HTML文件中，使用
<iframe>标签创建一个空的iframe元素，指定一个唯一的id属性，例如：<iframe id="myFrame"></iframe>。 - 在父HTML文件中，使用JavaScript获取到该iframe元素的引用，可以通过
document.getElementById()方法或其他选择器方法获取，例如：var iframe = document.getElementById("myFrame");。 - 使用iframe的
src属性将要导入的HTML文件路径赋值给它，例如：iframe.src = "path/to/your/file.html";。 - 可以通过设置iframe的其他属性来控制导入的HTML文件的显示方式，例如设置
width和height属性来指定iframe的尺寸。
完整的代码示例：
<!DOCTYPE html>
<html>
<head>
<title>父HTML文件</title>
</head>
<body>
<h1>父HTML文件</h1>
<iframe id="myFrame"></iframe>
<script>
var iframe = document.getElementById("myFrame");
iframe.src = "path/to/your/file.html";
iframe.width = "500px";
iframe.height = "300px";
</script>
</body>
</html>在上述代码中，将path/to/your/file.html替换为要导入的HTML文件的实际路径。通过设置iframe的width和height属性，可以调整导入的HTML文件在父HTML文件中的显示尺寸。
请注意，由于题目要求不能提及具体的云计算品牌商，因此无法提供腾讯云相关产品和产品介绍链接地址。
相关·内容
我有一个包含源www.abc/main.html的iframe
<iframe id="my-iframe" src="http://www.abc/main.html"></iframe>
abc/main.html导入并执行一些js文件。我想使用MutationObserver来获取它正在导入的js文件的名称。
var observer = new MutationObserver(function (mutations) {
mutations.forEach(function (mutation) {
浏览 1提问于2019-05-31得票数 0
我试图在一个Nuxt应用程序上实现Google标记管理器，并且在打开主体标记中的每个页面/路径上如何将noscript标记添加到应用程序中。我尝试创建一个静态脚本并通过nuxt配置添加文件：
{ src: "/scripts/gtm.js", body: true }
它将文件添加到正文中，但由于noscript标记和来自gtm的嵌套iframe而引发错误。不确定是否有更好的方法将实际脚本直接注入到正文中。
<!-- Google Tag Manager (noscript) -->
<noscript><iframe
src="https
浏览 5提问于2021-11-30得票数 2
回答已采纳
1回答
所以我现在正尝试从我的Main.js中获取一个变量并导入到一个名为Iframe.html的文件中，它的主题是一个字符串，其中包含了来自zen-desk的票证主题。
这是定义了变量“Main.js”的主题文件
function showInfo(data) {
var requester_data = {
//'email': data.ticket.address
//'name': data.ticket.name
'description': data.ticket.description,
'su
浏览 1提问于2018-06-21得票数 0
我在React公共文件夹中有一个文件夹(比如SDK)，里面包含一堆html和js/jQuery文件。
我使用src 在我的react代码中作为iframe访问这些文件。
如何将此SDK文件夹从public/SDK移到React项目中的src/SDK，然后在我的React代码中访问iframe中的homepage.html？
我已经通过创建React应用程序并使用yarn build来构建它来引导应用程序。
浏览 1提问于2020-09-04得票数 0
6回答
有人告诉我，使用Div而不是iframe是前进的方向，所以我使用我的banner和body中的框架。如何将我的index.html加载到我的div中？
浏览 0提问于2011-05-24得票数 8
我有一个正在开发中的项目。我需要使用外部登录页面作为主页。因此，我需要导入登陆index.html，但它有自己的css和js文件夹(主要是Jquery代码)。
我想将其作为<iframe src={html}></iframe>导入到我的项目中，但我的应用程序似乎无法加载htmls。
导入使用自己的jquery代码进行反应的html文件的最佳方式是什么？
浏览 2提问于2020-03-16得票数 0
我有一个项目，我必须在一个页面中使用相同的组件两次，但是组件没有对此给予许可，所以我想将它与iframe一起使用，但是我找不到如何将iframe src设置为string html。我可以用div绑定html，但是我不能用iframe来绑定
，这是我的传输管道：
@Pipe({ name: 'safe' })
export class SafePipe implements PipeTransform {
constructor(private sanitizer: DomSanitizer) {}
transform(url) {
return
浏览 0提问于2018-04-09得票数 2
回答已采纳
2回答
我试图将HTML (.html)作为组件导入到(.tsx)中。
但它给了我一个错误：
错误-/pages/SM_login/Facebook.html模块解析失败:意外令牌(1:0)您可能需要一个适当的加载程序来处理该文件类型，目前还没有配置加载程序来处理该文件。请参阅
\x{e76f}
这是我的代码：
const facebook = require('./SM_login/facebook.html');
export default class CustomDocument extends Document {
render() {
浏览 11提问于2021-12-12得票数 0
回答已采纳
1回答
我正试图为一个WordPress网站设计一个paypal。我唯一的问题是我无法让我的风格真正发挥作用。他们甚至在检查的时候都没有出现在风格上。我只能对iframe元素进行样式化，但是没有任何内容。
代码是这样的
<iframe>
#document
<!doctype html>
<html>
<head>
</head>
<body>
//content
</body>
</html>
</ifra
浏览 1提问于2018-01-29得票数 0
回答已采纳
如何将#content移动到#wrapper中
index.html
<iframe id="my-iframe" src="./iframe.html"></iframe>
<div id="content"><p>content</p></div>
iframe.html
...
<div id="wrapper"></div>
...
预期结果：
...
<div id="wrapper">
&
浏览 0提问于2016-04-02得票数 1
回答已采纳
2回答
我在Excel表格中有成千上万的学生记录。现在，我将把所有数据从Excel sheet导入到coredata，并使用该Coredata创建我的iPhone应用程序。
我不知道如何将Excel文件数据导入到coredata中。
浏览 5提问于2010-10-20得票数 0
回答已采纳
7回答
从另一个文件导入变量？
、、、
如何将变量从一个文件导入到另一个文件？
示例：file1具有变量x1和x2如何将它们传递给file2
如何将变量的所有从一个导入到另一个？
浏览 12提问于2013-06-23得票数 189
回答已采纳
<iframe src="#link">
#document
<!doctype html>
<html>
...
</html>
</iframe>
我如何将自己的CSS样式应用于#document中的任何元素--我只能使用CSS，而不是Jquery。
浏览 2提问于2019-10-28得票数 0
回答已采纳
我正在处理索引.(php/html)页面，需要从其他文件夹中添加一些文件。我可以将这些文件保存为php或html。在什么时候和什么情况下使用<iframe>而不是<?php include>来添加这样的文件有什么一般规则吗？
HTLM <iframe src="example.html" width="1280" height="300">
PHP <?php include 'example.php'; ?>
浏览 6提问于2013-10-09得票数 1
回答已采纳
我正在寻找一个轻量级的方法，客户端包括HTML文件。特别是，我想让客户端包括researchr.org的发布页面，在第三方网页上。例如，我想导出一个类似
http://researchr.org/profile/eelcovisser/publications
(可能只是那一页的出版物盒。)
使用iframe可以包含HTML页面：
<iframe class="foo" style="height: 50em;" width="100%" frameborder="0"
src="http://research
浏览 0提问于2009-09-27得票数 1
1回答
将菜单栏固定在页面左侧
、、、
我有一个描述菜单栏的HTML文件。菜单栏具有以下格式，我将其作为iframe导入到其他HTML文件中：
<ul> class="navbar">
<li><a href="home.html">Home</a></li>
</ul>
(当然，使用更多的li和正确的语法:)
为此，我有以下CSS：
ul.navbar, iframe {
list-style-type: none;
padding: 0;
margin: 0;
position: absolute
浏览 0提问于2012-03-06得票数 0
是否有任何方法将带有所有链接的css和javascript文件的外部html文件导入到已有的html文档中？
我尝试过使用JQuery方法，但它似乎完全忽略了脚本。
基本上，我想要做的是加载一个完整的组件，包含它的样式和逻辑/行为。
我需要在客户端用javascript做这件事。
浏览 3提问于2014-09-24得票数 0
回答已采纳
我想将一个文件导入到(一个React组件)中。
peft.html
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
index.js
import perf
浏览 2提问于2018-06-11得票数 14
回答已采纳
2回答
与iframe重叠的网站
、、、、
我正在开发一个BHO来拒绝访问被禁止的网站。因此，当我找到某个URL时，我只需使用以下代码打开一个iframe：
Document:= IE.Document as IHTMLDocument2;
iFrame:= Document.createElement('iframe');
iFrame.setAttribute('src', 'denied.html', 0);
iFrame.setAttribute('position', 'fixed', 0);
iFrame.style.width:= '1
浏览 4提问于2012-08-16得票数 1
回答已采纳
1回答
一种不同的电子.html文件
、、、、
我需要以某种方式将大量html页面导入到一个电子页面中(im使用w2ui布局)。
我试过：
<iframe src="../map/index.html"></iframe>
但它不起作用：
<script>require('./index.js');</script>
(未定义的ReferenceError: index.html:15没有定义要求)
浏览 1提问于2017-05-04得票数 0
回答已采纳
我有一个要求，以保存网址到a.txt文件和访问的网址与一些sample.html文件。
下面是我从.txt文件中获取url的代码。
<html>
<head>
<script>
function readfile() {
alert(document.getElementById('iframe').contentDocument.body.firstChild.innerHTML);
}
</script>
</head>
<body>
<iframe id='iframe'
浏览 1提问于2016-02-12得票数 1
2回答
我正在寻找一种方式来显示一个孤立的覆盖在一些网站使用WebExtensions。
iframe似乎是实现这一目标的最佳途径，因为它为css、js和DOM提供了一个完整的独立范围。另一件整洁的事情是，目标网站将无法阅读或更改内容。
在Chrome扩展中，似乎没有任何问题，但是使用火狐中的WebExtensions，即使它们使用相同的语法，我也会收到安全警告/错误，但它不起作用。
我试过两种不同的方法：
创建一个没有src属性的iframe，并将其注入到网站的主体中。此方法失败，因为我在执行iframe.contentWindow.document.open()时会收到CSP错误/警告。
相关
浏览 11提问于2017-01-19得票数 6
我目前正在使用一个相当复杂的wget命令，但它的本质是下载所有先决条件的-p和-k标志。如何将下载的主文件重命名为index.html？
例如，我下载了一个网页。
http://myawesomewebsite.com/something/derp.html
例如，这将下载：
derp.html
style.css
firstimage.png
secondimage.jpg
甚至还有一个iFrame：
iframe.html
iframe-style.css
因此，现在的问题是如何将derp.html重命名为index.html，而不会意外地将ifra
浏览 1提问于2012-08-14得票数 3
回答已采纳
2回答
如果局部html在反应或角度上
、、、、
我试图在iframe中显示一个本地html文件。在角度和反应上都是工作的，它工作在开发模式下，但是在生产 (AWS扩增)上我得到的错误“不能匹配任何路由”。
我对以前类似的问题尝试了所有的答案，但没有解决办法。我尝试了很多种位置(在src中，在公共场合，创建资产文件夹等等)。我尝试了许多种地址语法，例如：
<iframe src="address.html"></iframe>
<iframe src="./address.html"></iframe>
<iframe src="../address
浏览 13提问于2021-12-12得票数 1
我想不出如何将本地文件加载到Blazor服务器模板中。我希望在模板的Index.razor页面上的iframe中加载Test.html文件。与Index.razor文件保存在同一个文件夹中的是Test.html文件。但是它看不出来？怎样做才是正确的？ @page "/"
<h1>Main Blazor</h1>
<iframe src="Test.html" width="600" height="800" frameborder="0"></iframe>
浏览 106提问于2020-12-06得票数 0
回答已采纳
2回答
我已经创建了两个网页，一个包含另一个在一个iframe。我想通过javascript从父页面滚动嵌入的页面。
到目前为止，我已经尝试过：
$('#go').scrollTop(200);
$('.footer').scrollTop(200);
var frame = document.getElementById('go');
frame.contentWindow.scrollTo(0, 200);
这些都不起作用
父网页html：
<html>
<body>
.
.
.
<div class
浏览 9提问于2013-05-29得票数 12
回答已采纳
例如，这有效吗？
<!doctype html>
<html>
<head>
<title>Some Iframes</title>
</head>
<body>
<iframe id="frame1" src="/html/test-frame.html"></iframe>
<iframe id="frame2" src="/html/test-frame.html">
浏览 4提问于2014-04-10得票数 5
回答已采纳
我使用的是具有属性type的youtube Iframe，显然type不是一个存在于Iframe上的属性。如何将此属性添加到Iframe类型定义中？
在我的反应组件中，Iframe的定义是：
<iframe
id="ytplayer"
type="text/html"
src={someSource}
frameBorder="0">
</iframe>
TS抛出的错误：
Property 'type' does not exist on type 'Detail
浏览 0提问于2019-07-22得票数 2
回答已采纳
我需要在iframe内固定底部页脚。这里我使用的是全高宽的iframe。所以现在我在这个文件里面有一个页面iframe.html，我正在使用index.html文件，这里我有固定的页脚。它可以在网页和安卓浏览器上运行，但不能在iOS safari浏览器上运行。
为此，我在页脚中使用了position: fixed属性。
iframe.html文件
<iframe src="index.html" id="iframe"></iframe>
iframe.html css文件
iframe {
position:absolute;
浏览 0提问于2015-11-03得票数 1
我有一个包含https://登录页面的iframe，还有一些将CSS样式应用于父窗口上的iframe的JavaScript -这个父窗口是http://.协议不匹配，虽然我知道这与跨域问题有关，但我不知道如何将iframe和父窗口设置为使用相同的协议而不影响安全性。
任何帮助都将不胜感激，如果需要，可以发布代码。
谢谢
浏览 2提问于2014-03-13得票数 1
我是否可以在iframe中使用不同于托管页面的doctype，或者iframe必须从托管页面继承doctype？
<!DOCTYPE 1>
<html>
<body>
<iframe>
<!DOCTYPE 2>
</iframe>
</body>
</html>
浏览 1提问于2011-03-22得票数 8
回答已采纳
我有一个名为somepage.html的页面，页面otherpage.html作为somepage.html中的iframe，somepage.html的源代码是
<body><iframe src="otherpage.html name="frame"></body>
otherpage.html的源码是
<body onload="somefunction()" onunload="otherfunction" >the other content here</body>
浏览 0提问于2011-04-09得票数 0
我想使用一个外部HTML文件，它可以在运行时导入到我的Flex应用程序中。
我听说过太多关于iFrame选项的问题，所以如果可能的话，我想避免这种情况。
有没有人有其他好的建议来处理这个问题？
浏览 1提问于2010-02-05得票数 1
设想情况：
我有一个页面的表单，加载超过4个iframe。我没有控制在这个iframe，因为这是由其他网站(API)；
Iframe有一个表单并在其中输入。
在我的代码中
<form>
<div class="fields">
<!--onload iframe will populate this area-->
</div>
<div class="fields">
<!--onload iframe will populate this area-->
</
浏览 4提问于2016-09-05得票数 4
我想在Django项目中使用Javascript文件。但不知何故，我不知道如何将它导入到我的html文件中。我试图添加它的方式与我的css文件，但它不工作。在加载时，它总是显示相同的错误："Uncaught : fun1在onload时没有定义“。
项目结构：
Js文件，coding.js：function fun1(){ alert("It works!") }
Index.html文件，<script src="{% static '/js/coding.js' %}"></script>
正如我提到
浏览 1提问于2022-11-12得票数 -1
回答已采纳
3回答
导入HTML中的JS函数
、、、、
我有一个JS文件，它导出一些函数。我需要HTML body标记的download属性中的其中一个。如何将JavaScript函数导入到内联HTML中？
我尝试了以下几点：
JS文件
export function initPage() { ... }
HTML文件
<script type="module" src="js/script.js"></script>
<body onload="initPage()">
但我得到了一条错误信息：
Uncaught ReferenceError: initPage
浏览 6提问于2022-07-12得票数 0
回答已采纳
我尝试使用JavaScript将iframe动态添加到网页中。我想知道是否可以在不通过URL使用另一个html文件的情况下设置我的iframe的src属性。我将使用DOM createElement在jQuery中创建iframe。
谢谢！
浏览 2提问于2010-08-12得票数 14
回答已采纳
我需要在网页上使用.txt文件的内容。问题是我不能用简单的方式(服务器端的php)。我想出了在iframe中打开一个文本文件，然后请求innerHTML/innerText的诀窍。事实证明，人们以前就在那里-在上找到了以下代码，比我的尝试要干净得多
它可以在FireFox和IE下本地运行，但不能在Chrome下运行。如何让它在Chrome下工作？
function getIframeContentText( frameID )
{
var elt = document.getElementById(frameID);
//alert( "getIframeContent
浏览 15提问于2017-02-24得票数 0
1回答
如何从父窗口url获取变量到子窗口url，或者如何将变量从父iframe获取到子iframe？
我有一个包含iframe的index.html文件，它的表单将数据发送给checker.php，而这个文件用变量将用户转发给example.php，也就是说，http://www.example.com/sample.php?variable=variable example.php有iframe，而iframe有iframe名为authenticate.php .。
浏览 0提问于2012-02-28得票数 0
回答已采纳
2回答
我在一个asp页面上有一个按钮，它调用js文件中具有参数a和b的函数“java_s.js”。就像这样：
<button id="abc" onclick= "LoadContent(a,b)"></button>
现在有另一个asp页面，其中包含一个iframe，并显示html页面的内容，xyz.html如下所示：
<iframe src="xyz.html"></iframe>
我在其中包含了java_s.js文件。但问题是，当调用这个LoadContent()函数时，它无法将内容放入在xyz.h
浏览 9提问于2014-02-19得票数 0
回答已采纳
1回答
我有一个包含两个链接LinkA和LinkB的页面A，还有一个包含iFrame iFrameB的页面B
我想点击LinkA，然后转到页面B，在iFrame中加载一个网址，如果我点击LinkB，同样做同样的事情，但是在iFrame中加载一个不同的网址。
这个是可能的吗？
编辑
Page A
<a href="????">LinkA</a></div>
<a href="????">LinkB</a></div>
Page B
<iframe width="100%
浏览 2提问于2015-06-12得票数 0
我目前正在开发一个firefox扩展，当用户点击扩展图标时，它会在当前页面中插入一个iframe。我设法插入了iframe代码，我知道如何将src属性链接到我的html文件。
在chrome版本中，我简单地做了一个
var main_html = chrome.extension.getURL('main.html');
我将链接传递给iframe的src属性，如下所示：
iframe.setAttribute("src",main_html);
因此，与resource://idofmyextension/content/data/main.html类似，
浏览 3提问于2012-12-05得票数 2
4回答
无法将send_keys()用于iframe。如何选择这个iframe，其中的哪个元素应该用于send_key()？
和iframe html代码
<iframe class="textarea" src="/framework/html/blank.html" style="width: 99%; border-width: 1px; height: 332px;">
#document
<html webdriver="true">
<head>
</head>
<
浏览 6提问于2013-09-20得票数 30
回答已采纳
我的HTML中有一个iframe，我想播放本地文件夹中的mpeg/mpg文件，但我无法将视频加载到iframe中。当我设置src="时，它会显示在iframe中，但如果我尝试使用src="file:///C:/Documents%20and%20Settings/jgabotero/Desktop/sample.jpg“，它不会显示图像。
如何将iframe的src属性设置为指向本地文件，特别是存储在IsolatedStorage中的文件？
提前谢谢你。
--朱莉
浏览 1提问于2010-08-26得票数 4
1回答
我有一个带有一些内联css和javascript的页面，在原始页面上的javascript包含一些点击和滚动逻辑，看起来像这样
$('#abc').on('click', function() {
$('html, body').scrollTop($('#xyz').offset().top)
});
它在原始页面上运行良好；
现在我有了一个新页面，它将原始页面作为iframe导入到新页面上，但是因为它是iframe，所以这个iframe中原始页面上的javascript代码的作用域现在绑定到iframe本身，并且因为它绑定
浏览 8提问于2021-09-14得票数 0
在触发onload时，我一直在阅读激活javascript的内容，以及如何将多个实例连接在一起(以及一些缺陷)，但是如果我在主父窗口的主体中运行一个，在父窗口中运行一个iframe，那么onload之间会不会有“冲突”呢？
浏览 1提问于2014-06-23得票数 0
回答已采纳
我试图在两个不同的iframe中添加两个本地html文件(作为frame，在一个html代码中)，但它不起作用。在两个框架中显示相同的html文件的输出。我想，屏幕截图将有助于理解我的问题 这是我的html代码。 <!DOCTYPE html>
<html>
<head></head>
<body>
<h1>Frame1:</h1>
<iframe src="frame1.html" frameborder="1" width="100%" height
浏览 51提问于2021-06-15得票数 1
回答已采纳
我有一个用HTML、CSS和一些in-line JS构建的简单网站。我希望能够使用这个NPM包，但我不知道如何使用。我尝试在我的项目目录中运行npm install simplemde --save。它创建了一个包含node_modules包的NPM文件夹，但是如何将其导入到项目中呢？如果我只是尝试使用这个包而没有以任何方式导入它，我就会得到一个错误：
未定义ReferenceError: SimpleMDE未定义。
浏览 3提问于2021-02-01得票数 2
回答已采纳
1回答
这可能是我遇到的一个简单的问题，但我想不出来。
我有按钮，当我点击fancybox按钮时，会打开一个带有我网站页面的iframe。它包含一个用于发送电子邮件的简单表单。一切都很好，但我使用了lib.phpmailer，但我似乎不能包含它。
include_once 'url/classes/lib.phpmailer.php';
我使用的url是有效的，并且指向phpmailer文件。但是iframe不包括它。
你知道怎么解决这个问题吗？
下面是一些代码：
<a class="reserve"
href="http://<?=$_SE
浏览 1提问于2014-01-31得票数 0
以下是我打算做的事：
使用Java服务，我从URL (Jsoup)中获取HTML内容，并将其作为字符串返回给调用方，在这种情况下是角脚本或JS脚本。我想把这个内容保存在某个地方，然后把它放到一个Iframe或者类似的地方。
我的目的是在返回HTML之前稍微修改一下HTML。那么，如何将HTML字符串显示到iframe中呢？或者我需要将它保存到HTML文件中，然后在iframe中显示它？有比iframe更好的解决方案吗？
浏览 3提问于2016-08-26得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
云直播活动推荐
腾讯云开发者
