为什么我的 div 容器中的元素消失了？

Question

我对浏览器在处理 div 容器内的元素时的行为有疑问。我有一个 Iframe，用于向服务器发出对运行 PHP 文件的请求，而父页面保持动态。父页面向子框架发出的请求决定了当服务器 returns 将结果发送到子框架时，父页面上的某些元素最终会发生什么。我已经测试了一切，一切正常，除了一个明显的故障。如果有人碰巧在主页上调用一个函数试图读取 div 容器内的元素，而子框架正在对同一 div 容器内的任何元素进行更改，则程序会给出一个空错误。当我使用调试器检查 div 容器的元素时，该特定 div 容器内的所有元素（总共 14 个）都消失了。我确定我可以通过首先查询一个随机元素以查看它是否存在来解决问题，如果不存在，则在子框架完成父页面后稍后放置一个回调函数。但是我很好奇为什么那个特定 div 容器内的所有元素首先在那个确切的时刻都消失了，因为子框架只操作 div 内的 5 个元素，并且父请求正在寻找一个完全不同的元素，该元素未被子框架操纵。我假设对 div 容器内的元素进行更改会强制重写 div 内的所有元素是否正确？文档正文中的所有其他 div 容器元素保持不变，只有一个 div 被更改。这不是确切的代码（对 post 而言太多了），而是一个示例。

// Parent
document.getElementById("heading").innerHTML = "Where did you go?";

// Child Frame
parent.document.getElementById("pic").src = "anotherpic.jpg";

<div id ="something">
  <P id = "heading">blah blah blah</p>
  <img id = "pic" src = "picture.jpg">
  <p id = "picname">Picture Name</p>
</div>

如果子运行首先，父尝试读取元素，而子仍在 div 中更改元素，当我寻找它们时，所有元素都消失了在调试器中。对这种行为的任何见解表示赞赏。谢谢。（希望这不是一个愚蠢的问题。哈哈）

Answer 1

您是否尝试过使用： target.addEventListener(类型, 侦听器 [ 选项]);

而不是：通过 Id 获取元素？

看起来有些东西被覆盖了。

Answer 2

请注意这里没有“同时”这样的词。 innerHTML 和 getElementById 同步工作。

即使您使用 innerHTML 不当（我知道情况并非如此），例如。覆盖父组件 - 没有您可以使用函数访问的“中间状态”，注意“时刻”没有元素。所以我会去别处寻找背后的原因。

例如。 Iframe 内容每次修改父级两次，第一次使它为空。

为什么我的 div 容器中的元素消失了？

Why does the elements inside my div container disappear?

html

javascript

css

browser

dom