如何使用jquery将javascript代码注入到iframe头中
使用jQuery将JavaScript代码注入到iframe头中的方法如下：
- 首先，确保你已经引入了jQuery库文件，可以通过以下方式引入：
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>- 创建一个iframe元素，并将其插入到页面中的合适位置：
<iframe id="myFrame"></iframe>- 使用jQuery的.ready()方法，确保页面加载完成后执行代码：
$(document).ready(function() {
// 在这里编写你的代码
});- 在.ready()方法中，通过jQuery的contents()方法获取到iframe的文档对象，并使用jQuery的find()方法找到head元素：
$(document).ready(function() {
var iframeDoc = $("#myFrame").contents();
var head = iframeDoc.find("head");
});- 在head元素中插入一个script标签，并将JavaScript代码作为其内容：
$(document).ready(function() {
var iframeDoc = $("#myFrame").contents();
var head = iframeDoc.find("head");
var script = $("<script></script>").text("你的JavaScript代码");
head.append(script);
});完整的代码如下：
<!DOCTYPE html>
<html>
<head>
<title>使用jQuery将JavaScript代码注入到iframe头中</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
<iframe id="myFrame"></iframe>
<script>
$(document).ready(function() {
var iframeDoc = $("#myFrame").contents();
var head = iframeDoc.find("head");
var script = $("<script></script>").text("你的JavaScript代码");
head.append(script);
});
</script>
</body>
</html>这样，你就成功地使用jQuery将JavaScript代码注入到了iframe头中。请注意，这种方法只适用于同源的iframe，即iframe的源与页面的源相同。
相关·内容
1回答
动态创建时在iframe中运行的jquery
javascript、jquery
我正在尝试首先创建一个iframe，然后将jQuery库注入其中，然后发出警告，告知jQuery已加载。
jQuery库按预期插入到iframe头中，并将有关jQuery的警报加载到主体中。
问题是，它没有显示警报，而是显示jQuery is not defined。
有没有人能提点建议？
以下是代码
<!doctype html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"
浏览 0提问于2013-04-17得票数 0
回答已采纳
1回答
如何在iframe的本地作用域中执行javascript代码？
javascript、jquery、iframe
我在iframe中加载了html文档。
我在javascript中为该文档开发了一些弹出菜单代码，并将代码从主文档中注入到iframe中。
但是我的代码在iframe中不起作用，因为它使用了"document“对象，这令人惊讶地引用了主文档，而不是iframe文档。
我还在内容选择方面发挥作用，在那里我需要window.getSelection()，它可以追溯到主文档的选择，而我需要window.frames[0].getSelection()。
我做错什么了吗？
有什么简单的解决办法来克服这个问题吗？
UPDATE:(clarification)
正如Bergi所指出的，我的问题是如
浏览 2提问于2013-05-07得票数 4
回答已采纳
3回答
将javascript函数注入Iframe
dom、iframe、head、javascript
()描述了如何将代码从脚本注入到iframe：
function injectJS() {
var iFrameHead = window.frames["myiframe"].document.getElementsByTagName("head")[0];
var myscript = document.createElement('script');
myscript.type = 'text/javascript';
myscript.src = 'myscript.js'; // rep
浏览 6提问于2013-04-24得票数 42
回答已采纳
1回答
将外部样式表链接到iframe中的页面
html、css、iframe、local
我已经检查了很多其他问题，但仍然没有成功。
我在我的本地机器上使用chrome。
我有welcome.html (主页)和test.html (iframe页面)，然后我有我的style.css。
这样做的目的是:让我的test.html在我的welcome.html页面中作为iframe。但是使用jQuery设置iframe (test.html)的样式。
所以我的welcome.html里有这个
<script src="https://code.jquery.com/jquery-1.10.1.min.js"></script>
<scri
浏览 0提问于2013-11-09得票数 0
1回答
动态加载JavaScript库并调用
javascript、jquery、iframe
尝试动态加载JavaScript库。错误-未定义警报。我有HTML代码和库(alertify)。我无法将其插入到iframe
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script src="https://code.jquery.com/jquery-3.4.1.js"></script>
</head>
<body>
<iframe cla
浏览 2提问于2020-01-27得票数 2
2回答
如何从HTML文件访问iframe中加载的URL的“id”、"name“等
javascript、jquery
我有一个Iframe.html文件：
<body onload="alert('frame 1 loaded');">
<div> This is frame 1 content </div>
<a id="a1" href="Sample.html"> click</a>
</body>
Sample.html
<body>
<ul id="list1">
<li name="one">o
浏览 1提问于2011-03-31得票数 0
回答已采纳
5回答
当将Iframe添加到文档时，如何防止它重新加载？
javascript、jquery、dom、simplemodal
我们使用simplemodal插件作为对话框的内容托管一个iframe。关闭对话框后，simplemodal从文档中移除对话框内容(用div包装的iframe )，然后将其添加回文档。
，下面的标记演示了这个问题，同时将simplemodal从等式中去掉。，我在这篇文章中只是在上下文中提到了simplemodal，说明了为什么删除和重新添加iframe。
如何防止Iframe在将其重新添加到文档时重新加载其内容？
任何帮助都将不胜感激！
test.html
<!DOCTYPE html>
<html>
<head>
<title><
浏览 7提问于2011-03-22得票数 2
1回答
使用javascript访问iframe元素的html
javascript、html、iframe
在一个非常简单的设置中，我确实得到了错误的输出。文件MyFrame.HTML：
<!DOCTYPE html>
<html>
<head>
<title>My Frame</title>
</head>
<body>
<a href="https://www.google.com">Google</a><br />
<a href="https://www.bingle.com">Bingle&l
浏览 2提问于2022-07-24得票数 0
3回答
如何根据另一个已存在的选择器选择元素？
javascript、jquery、iframe、document、designmode
我有以下代码：
<html>
<head>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
google.load("jquery", 1);
</script>
<script type="te
浏览 7提问于2012-08-19得票数 0
回答已采纳
1回答
在iFrame页面内容之前插入html内容
javascript、jquery、html、iframe
我想将html内容插入到iFrame中。要求是要在iFrame页面内容之前插入/追加此内容。
我有下面的示例代码。目前，我使用了追加函数，它在Iframe页面内容之后添加新内容。
TestPage.html
<html>
<head>
<script src="jquery.js"></script>
<title>Test Page</title>
</head>
<body>
<iframe id="sampleIframe" src
浏览 3提问于2015-03-05得票数 0
回答已采纳
2回答
在iFrame中运行自定义JavaScript代码时出现的问题
javascript、jquery、html、iframe
所以我正在做一个像JSFiddle这样的JS游乐场。在添加JavaScript功能和调用不同函数时，代码似乎是从页面文档根目录运行的，而不是从iframe根目录运行的。
$(document).ready(function()
{
var result = $("#result");
htmlVal = htmlEditor.getValue();
cssVal = cssEditor.getValue();
jsVal = jsEditor.getValue();
iframe = $("<iframe><
浏览 3提问于2015-02-21得票数 0
2回答
使用jquery在iframe中动态显示javascript google广告的问题
javascript、jquery、html、iframe
我们尝试在动态添加的iframe中显示google广告。在iframe中，字段"src“通常是一个url，但我们希望使用data:text/html格式，以便能够直接使用我们的广告代码。它适用于简单的JavaScript代码，如document.write('hello world')<\script>，但不适用于谷歌广告代码。我们在一个html文件中模拟：
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.min.js
浏览 0提问于2010-08-13得票数 0
1回答
放大iframe而不使用css重新加载html内容
javascript、jquery、html、css、iframe
我还没有进行足够长的web开发来了解所有这些限制，但是我需要在一个更大的窗口中显示一个iframe，而不需要在其中重新加载html。我只想使用javascript/css，我不知道从哪里开始。
目前，我有一个iframe单击事件，单击该事件时，将从iframe加载具有相同html的jquery对话框。但是对话框中的页面加载了我以前在iframe中运行的所有javascript等。
报头
<!-- jquery -->
<script type="text/javascript" src="./js/jquery-1.11.1.min.js"&g
浏览 1提问于2014-11-13得票数 0
2回答
在Google Chrome中获取iframe内容高度
javascript、jquery、google-chrome、iframe
有没有人能帮我在Google Chrome上做这段代码？它在IE上工作得很好。
谢谢。
<!doctype html>
<html>
<head>
<script src="http://code.jquery.com/jquery-2.1.3.min.js"></script>
<script>
function calcIframeSize() {
var altura = $("body", $("#frameExtraFields").co
浏览 1提问于2015-03-04得票数 0
1回答
Iframe文档全局
javascript、jquery、html、iframe
这是我在几个月内遇到的第一个js/HTML问题，我一直无法在网上找到答案。如果我使用jquery或普通文档动态填充iframe (所以我猜与父文档来源相同)，并且在主体中使用使用" document“global - IE”$( JavaScript ).ready“的一些脚本填充子iframe，我如何确保它访问子文档而不是父文档？如果我用以下HTML填充动态iframe：
<iframe id='if'><iframe>
并在脚本标记中添加了以下函数：
$(function () {
var innerDoc = $($('#i
浏览 1提问于2015-07-17得票数 1
2回答
用jQuery生成iframe和内容
jquery、html、ajax、iframe
我不明白为什么不起作用。
我有一个remote.php脚本
<?php echo "Hello World"; ?>
和一个local.php脚本
<html>
<head>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.easyui.min.js">&l
浏览 1提问于2015-02-03得票数 1
回答已采纳
1回答
将表单发布到iframe，然后使用javascript从iframe获取内容？
javascript、iframe、cross-domain
我在一个网站上工作，在那里我需要从iframe获得内容。代码在这里。
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-lates…
</head>
<body>
<iframe src="http://glimmertech.org/IF222.htm" width="80%" height="600" id="frameDemo">
浏览 0提问于2012-12-04得票数 0
回答已采纳
1回答
如何通过iFrame设置实时输入值链接？
javascript、jquery、html
请看下面的两个HTML页面，我有一个页面在iFrame内调用其他页面。我真正需要的是，我想在"iframe.html“中看到文本字段。当我在那个输入框中写一些东西时，这个值应该在href=内实时地取出来。
注意: iframe.html页面是纯html页面。我不能在页面中使用jquery。我必须从index.html页面访问那个页面。
我尝试过一些jquery代码，但只有我编写了函数。
这是index.html页面。
<html>
<head>
<script type="text/javascript" src="http://c
浏览 4提问于2015-05-23得票数 2
4回答
IE中jQuery设置的iframe‘`name`’属性的怪异行为
jquery、internet-explorer、forms、iframe
我正在通过将文件以一种形式上传到iframe来进行ajax风格的文件上传，并注意到IE中的一些奇怪行为(似乎都发生在6和8中)。基本上，在IE中，表单没有正确地target iframe，所以响应出现在一个新窗口中(而不是在iframe中)。您可以使用以下最小的HTML/JS来重现问题：
<html>
<head>
<script src="http://code.jquery.com/jquery-1.3.2.js"></script>
<script>
$(document).ready(funct
浏览 5提问于2010-01-20得票数 10
回答已采纳
1回答
Javascript总是认为我的IFrame内容和大小是空的，但是它没有--试图将IFrame的大小自动调整为注入的内容
javascript、jquery、html、iframe
因此，我已经为这个问题挣扎了几个小时，我发现的所有相关结果都表明我的代码是正确的，但显然不是，因为它不起作用。
最终，我要做的是调整IFrame高度的大小，以匹配它的内容(最小为100 an )。注意: IFrame 35382-内容将通过后端生成，因此这种填充IFrame的方法。
代码正确地用我想要的数据填充IFrame，并调整它的大小，但是由于某种原因，我显然忽略了内容高度总是以150 an (据我理解为IFrame的默认高度)和content ().find(‘html’)返回的html(用于转储IFrame的内容)--我为调试目的而抛出的内容--总是未定义的。
任何被欣赏的帮助或方向，
浏览 0提问于2018-05-17得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
活动推荐
腾讯云开发者
