使用 java 脚本函数重新加载 HTML 元素
Reload an HTML element using a java script function?
好吧,我有点问一个由两部分组成的问题,但回答任何一部分都会帮助我。我将直接回答我的问题,并直接跳到我需要帮助的地方。我正在尝试使用 Javascript 函数来定义 iframe 的某些元素,以便用户可以决定源、高度和宽度。我现在拥有的代码如下所示。
<script language="javascript">
window.onload = webPage;
function webPage(){
var page = prompt("please enter the website","www.google.com");
var height = prompt("Please enter the height of the frame","800");
var width = prompt("Please enter the width of the frame","600");
}
</script>
<iframe src=page height=height width=width>
</iframe>
有没有办法重新加载 iFrame 并让它使用用户输入作为我当前代码的元素?我还需要做其他事情才能将变量用于 iFrame 吗?感谢任何看我的问题并期待您的回答的人。
首先使用空白值和一个唯一 ID 初始化 IFrame,然后追加用户输入。
这是工作JSFiddle Link
动态更改值:
<!DOCTYPE html>
<html>
<head>
<title>Demo</title>
</head>
<body>
<iframe id="icereaper666" src="" height="0" width="0"></iframe>
<script language="javascript">
window.onload = webPage;
function webPage(){
var page = prompt("please enter the website","http://www.w3schools.com/");
var height = prompt("Please enter the height of the frame","400");
var width = prompt("Please enter the width of the frame","400");
var iframeElement = document.getElementById("icereaper666");
iframeElement.src = page;
iframeElement.height = height;
iframeElement.width = width;
}
</script>
</body>
</html>
注意:您还可以使用 createElement 动态创建 IFrame 元素。 Check this out
使用创建元素:
<!DOCTYPE html>
<html>
<head>
<title>Demo</title>
</head>
<body>
<script language="javascript">
window.onload = webPage;
function webPage(){
var page = prompt("please enter the website","http://www.w3schools.com/");
var height = prompt("Please enter the height of the frame","400");
var width = prompt("Please enter the width of the frame","400");
var iframeElement = document.createElement("iframe");
iframeElement.src = page;
iframeElement.height = height;
iframeElement.width = width;
document.body.appendChild(iframeElement);
}
</script>
</body>
</html>
<script language="javascript">
window.onload = webPage;
function webPage(){
var page = prompt("please enter the website","www.google.com");
var height = prompt("Please enter the height of the frame","800");
var width = prompt("Please enter the width of the frame","600");
//new content here
document.getElementById("theIframe").innerHTML="<iframe src='""+page+"'" height='""+height+"'" width='""+width+"'"></iframe>";
}
</script>
<div id="theIframe"></div>
相关文章:
- 在chrome.tabs.onCreated之后加载HTML页面
- 使用:new Image()控制加载html.src=html_URL
- AngularJS加载JSON数据,然后从中解析/加载HTML
- javascript弹出窗口没有正确加载html表单
- 什么更好?使用iframe或jQuery之类的东西在外部网站中加载HTML文件
- 使用jquery.load('pageName')方法时,未从应用程序缓存加载Html页
- 使用JS加载HTML元素
- 当select标记触发onChange事件时,从mysql数据库加载html表
- Android Webview没有'有时不会加载HTML
- 使用ajax在html中加载html文件时出现的问题
- 懒惰加载:如何使用jquery创建懒惰加载html页面
- 使用websockets加载.html和.js
- 加载 HTML 模板以通过浏览器与挖空组件一起使用
- 在jquery对话框中加载html页面
- 从Nodejs应用程序加载HTML表
- 在加载html网页时显示JavaScript表
- 当另一个显示时加载HTML而不修改他
- 一次加载HTML对象并多次使用
- 阻止/推迟加载html元素
- 如何在加载HTML时加载js文件