在 HTML 中更改对象标记上的数据内容 [英] Changing data content on an Object Tag in HTML
问题描述
我有一个 HTML 页面，其中包含一个 Object 标记来托管嵌入的 HTML 页面.
I have an HTML page which contains an Object tag to host an embedded HTML page.
<object style="border: none;" standby="loading" id="contentarea"
width="100%" height="53%" type="text/html" data="test1.html"></object>
但是，我需要在对象标记内更改 HTML 页面.当前代码似乎创建了对象的克隆并用它替换现有对象，如下所示:
However, I need to be to change the HTML page within the object tag. The current code seems to create a clone of the object and replaces the existing object with it, like so:
function changeObjectUrl(newUrl)
{
var oContentArea = document.getElementById("contentarea");
var oClone = oContentArea.cloneNode(true);
oClone.data = newUrl;
var oPlaceHolder = document.getElementById("contentholder");
oPlaceHolder.removeChild(oContentArea);
oPlaceHolder.appendChild(oClone);
}
这似乎是一种相当糟糕的方式.有谁知道更改嵌入页面的正确"方法?
This seems a rather poor way of doing this. Does anyone know the 'correct' way of changing the embedded page?
谢谢！
编辑:为了回应下面的答案，这里是我现在使用的页面的完整来源.使用 setAttribute 似乎不会改变 Object 标签的内容.
EDIT: In response to answers below, here is the full source for the page I am now using. Using the setAttribute does not seem to change the content of the Object tag.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Test</title>
<script language="JavaScript">
function doPage()
{
var objTag = document.getElementById("contentarea");
if (objTag != null)
{
objTag.setAttribute('data', 'Test2.html');
alert('Page should have been changed');
}
}
</script>
</head>
<body>
<form name="Form1" method="POST">
<p><input type="button" value="Click to change page" onclick="doPage();" /></p>
<object style="visibility: visible; border: none;" standby="loading data" id="contentarea" title="loading" width="100%" height="53%" type="text/html" data="test1.html"></object>
</form>
</body>
</html>
Test1.html 和 Test2.html 页面只是简单的 HTML 页面，分别显示文本Test1"和Test2".
The Test1.html and Test2.html pages are just simple HTML pages displaying the text 'Test1' and 'Test2' respectively.
推荐答案
这是我最终实现它的方式.你可以这样做
Here's how I finally achieved it. You can do
document.getElementById("contentarea").object.location.href = url;
也许
document.getElementById("contentarea").object.parentWindow.navigate(url);
Object 元素还有一个readyState"属性，可用于检查包含的页面是加载"还是完成".
The Object element also has a 'readyState' property which can be used to check whether the contained page is 'loading' or 'complete'.
这篇关于在 HTML 中更改对象标记上的数据内容的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
