如何在单个函数中创建window.open窗口并修改其内容？

嘿，我来帮你搞定这个窗口内容写入的问题！你遇到的核心问题主要是对新窗口对象的引用有点小偏差，加上事件绑定的时机可能没踩对。我给你拆解下问题，再给你两种可行的解决方案：

问题出在哪？ #

你代码里写的opened_window.window.onload其实多了一层.window——window.open()返回的就是新窗口的window对象本身，直接用opened_window.onload就够了。另外，如果没调用document.close()，浏览器可能不会渲染你写入的内容，这也是常见的坑。

方案1：等窗口加载完成后写入（更稳妥） #

这种方式适合需要确保窗口完全初始化后再操作的场景：

function showInformation() {
  // 打开配置好的新窗口
  var opened_window = window.open("", "opened_window", "width=300,height=300,menubar=no,location=no,resizable=no,scrollbars=no,status=no");
  
  // 绑定窗口加载完成事件，直接用返回的窗口对象就行
  opened_window.onload = function() {
    // 写入你需要的HTML内容
    opened_window.document.write("<h1>Hello from new window!</h1><p>这是你要展示的信息~</p>");
    // 关键：关闭文档流，让浏览器渲染内容
    opened_window.document.close();
  };
}

方案2：直接写入（更简洁） #

因为刚打开的窗口是空的，还没有加载任何内容，所以可以直接调用document.write，不用等onload：

function showInformation() {
  var opened_window = window.open("", "opened_window", "width=300,height=300,menubar=no,location=no,resizable=no,scrollbars=no,status=no");
  
  // 直接写入内容
  opened_window.document.write("<h1>Hi 👋</h1><p>你的信息已经显示在这里啦！</p>");
  // 别忘了关闭文档流
  opened_window.document.close();
}

额外注意事项 #

• 弹窗拦截：你的函数是通过按钮点击触发的，这符合浏览器的用户主动交互规则，不会被拦截；但如果是自动触发（比如页面加载时调用），大概率会被浏览器拦截。
• 窗口复用：window.open的第二个参数是窗口名称，如果这个名称的窗口已经打开，会复用它而不是新建。如果需要每次打开新窗口，可以把名称改成动态的，比如"opened_window_" + Date.now()。

内容的提问来源于stack exchange，提问作者rapid88