Firefox 从父窗口到子窗口的Javascript getElementById_Firefox_Google Chrome_Parent_Getelementbyid

Firefox 从父窗口到子窗口的Javascript getElementById

firefox google-chrome

Firefox 从父窗口到子窗口的Javascript getElementById,firefox,google-chrome,parent,getelementbyid,Firefox,Google Chrome,Parent,Getelementbyid,您好，谢谢您阅读我的帖子以下是我基本上想要做的：在第一个HTML页面（“parent.HTML”）中，有一个按钮当用户单击按钮时，会弹出一个新窗口（“child.html”）并且更新子窗口中“div”元素的内容在“Firefox”和“Chrome”下，最终操作不成功 parent.html <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loo

您好，谢谢您阅读我的帖子

以下是我基本上想要做的：

在第一个HTML页面（“parent.HTML”）中，有一个按钮
当用户单击按钮时，会弹出一个新窗口（“child.html”）
并且更新子窗口中“div”元素的内容

在“Firefox”和“Chrome”下，最终操作不成功

parent.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Parent window document</title>
  </head>
  <body>
    <input 
     type="button" 
     value="Open child window document" 
     onclick="openChildWindow()" />

    <script type="text/javascript">
    function openChildWindow()
    {
      var s_url     = "http://localhost:8080/projectroot/child.html";
      var s_name    = "ChildWindowDocument";
      var s_specs   = "resizable=yes,scrollbars=yes,toolbar=0,status=0";
      var childWnd  = window.open(s_url, s_name, s_specs);
      var div       = childWnd.document.getElementById("child_wnd_doc_div_id");
      div.innerHTML = "Hello from parent wnd";
    }
    </script>
  </body>
</html>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Parent window document</title>
  </head>
  <body>
    <div id="child_wnd_doc_div_id">child window</div>
  </body>
</html>


父窗口文档
函数openChildWindow（）
{
var s_url=”http://localhost:8080/projectroot/child.html";
var s_name=“ChildWindowDocument”；
var s_specs=“可调整大小=是，滚动条=是，工具栏=0，状态=0”；
var childWnd=window.open（s_url、s_名称、s_规范）；
var div=childWnd.document.getElementById（“child_wnd_doc_div_id”）；
div.innerHTML=“来自父wnd的Hello”；
}

child.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Parent window document</title>
  </head>
  <body>
    <input 
     type="button" 
     value="Open child window document" 
     onclick="openChildWindow()" />

    <script type="text/javascript">
    function openChildWindow()
    {
      var s_url     = "http://localhost:8080/projectroot/child.html";
      var s_name    = "ChildWindowDocument";
      var s_specs   = "resizable=yes,scrollbars=yes,toolbar=0,status=0";
      var childWnd  = window.open(s_url, s_name, s_specs);
      var div       = childWnd.document.getElementById("child_wnd_doc_div_id");
      div.innerHTML = "Hello from parent wnd";
    }
    </script>
  </body>
</html>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Parent window document</title>
  </head>
  <body>
    <div id="child_wnd_doc_div_id">child window</div>
  </body>
</html>


父窗口文档
子窗口

IE9=>它可以工作
Firefox13.0.1=>它不工作。错误消息：“div为空”
Chrome 20.0.1132.47 m=>不工作

你了解那种行为吗

你能帮我解决这三种情况吗

谢谢您并致以最良好的问候。

我认为在您尝试从窗口/文档访问元素时，该窗口/文档未加载。你可以这样做

childWnd.onload = function() {
    var div       = childWnd.document.getElementById("child_wnd_doc_div_id");
    div.innerHTML = "Hello from parent wnd";
}

你也可以看一看

解决这个问题的更好方法可能是对“child”进行更改。您可以使用

window.opener

访问父窗口。但是你应该记住父窗口可以关闭，所以你应该考虑某种类型的本地存储（例如Cookie）。

< P>我认为当你尝试访问它的元素时，窗口/文档没有被加载。你可以这样做

childWnd.onload = function() {
    var div       = childWnd.document.getElementById("child_wnd_doc_div_id");
    div.innerHTML = "Hello from parent wnd";
}

你也可以看一看

解决这个问题的更好方法可能是对“child”进行更改。您可以使用

window.opener

访问父窗口。但是你应该记住父窗口可以关闭，所以你应该考虑某种类型的本地存储（例如Cookie）。这确实解决了“Firefox”和“Chrome”的问题，但它不再适用于“IE”。。。致以最良好的问候。似乎window.open在IE中创建窗口之前返回。这里有一个可能的解决方案，但我将尝试找到/制作一个更好的解决方案（可能明天…）。再次问候，感谢您的回答。我按照您指向我的链接（带有“timeout”技巧（）的链接）定制了我的代码，现在它确实可以在我第一篇文章中提到的三种浏览器中工作。但这并不是完全令人满意的（那个“超时”把戏）。。。因此，我当然会对“更好”的解决方案感兴趣。[下一条评论]我还一直在想，也许我应该从父窗口获取子窗口中所需的内容，因为我知道打开子窗口时父DOM实际上存在。。。我不知道我是否在这里说清楚了。。。谢谢你的帮助和分享你的想法。你好，谢谢你的回答。这确实解决了“Firefox”和“Chrome”的问题，但它不再适用于“IE”。。。致以最良好的问候。似乎window.open在IE中创建窗口之前返回。这里有一个可能的解决方案，但我将尝试找到/制作一个更好的解决方案（可能明天…）。再次问候，感谢您的回答。我按照您指向我的链接（带有“timeout”技巧（）的链接）定制了我的代码，现在它确实可以在我第一篇文章中提到的三种浏览器中工作。但这并不是完全令人满意的（那个“超时”把戏）。。。因此，我当然会对“更好”的解决方案感兴趣。[下一条评论]我还一直在想，也许我应该从父窗口获取子窗口中所需的内容，因为我知道打开子窗口时父DOM实际上存在。。。我不知道我是否在这里说清楚了。。。谢谢你的帮助，并与我分享你的想法。