Javascript：在将片段添加到DOM时收到通知 我想要什么

我正在使用AJAX从服务器端加载一段HTML，并将其附加到文档中，我希望能够在片段完全添加到dom中时获得通知

我在做这样的事情：

// Load photos.html from the server with ajax
var instance = loadPageWithAjax('photos.html')

// Wait for response
instance.success = function(response){
   // Create Parent Object
   // Note that I MUST create a new div in my project
   var box = document.createElement('div');
       box.id = 'photos-box';

   // Insert html response to the box's innerHTML
   box.innerHTML = response;

   // Append box to the dom
   document.body.appendChild(box);
}

当片段被添加到dom中时，我想处理其中的内容，但我不能，因为我不知道片段实际上是什么时候被添加到dom中的

我尝试的 我尝试在响应后附加脚本：

document.getElementById('photo-box') = response 
                                     + '<script>alert(\'loaded\')</script>';

但它的加载速度比片段的其他部分快

---

那么，当片段被添加到dom中时，获得通知的正确方式是什么？

很抱歉，我不完全理解，但是如果在收到响应后启动了

instance.success=function（response）{}

，您应该能够在

document.body.appendChild（box）

之后调用函数，这是正确的，还是我走得太远了

很抱歉，我不完全理解，但是如果在收到响应后启动了

instance.success=function（response）{}

，那么您应该能够在

document.body.appendChild（box）

之后调用函数，这是正确的还是我错了

innerHTMLsetter和

appendChild

方法是同步的，因此DOM会立即更新

您可能希望在加载所有样式表和图像时得到通知。（innerHTML不适用于脚本）

这有点棘手。您必须迭代所有图像并检查它们的

已加载

状态，然后向每个未加载的图像添加

已加载

处理程序。

---

对于样式表，它甚至更复杂。有关可能的实现，请参阅。

内部HTMLsetter以及

appendChild

方法是同步的，因此DOM会立即更新

您可能希望在加载所有样式表和图像时得到通知。（innerHTML不适用于脚本）

这有点棘手。您必须迭代所有图像并检查它们的

已加载

状态，然后向每个未加载的图像添加

已加载

处理程序。

---

对于样式表，它甚至更复杂。有关可能的实现，请参阅。

为什么不在将对象添加到DOM之前完全设置对象，这样就不需要这样做了？或者，您可以在将对象添加到DOM时调用setTimeout并进行检查，然后循环，可能在检查之间等待100毫秒。@James Black这是什么意思

为什么不在将对象添加到DOM之前完全设置它呢
？我不认为setTimeout是好的，因为加载速度可能会有所不同，可能是setInterval，但这些解决方案真的很糟糕：|为什么不在将内容添加到DOM后在ajax成功回调中进行处理呢。我可能会误解，但所有浏览器的惯例是
innerHTML
都是阻塞的；只有将其中的所有内容添加到dom中，它才会返回，因此dom返回时实际上已准备就绪。@AlexK。也许你是对的，我的示例不是我用来让理解问题更简单的实际代码，但我会修改我的示例。为什么不在将对象添加到DOM之前完全设置对象，这样你就不需要这样做了？或者，您可以在将对象添加到DOM时调用setTimeout并进行检查，然后循环，可能在检查之间等待100毫秒。@James Black这是什么意思
为什么不在将对象添加到DOM之前完全设置它呢
？我不认为setTimeout是好的，因为加载速度可能会有所不同，可能是setInterval，但这些解决方案真的很糟糕：|为什么不在将内容添加到DOM后在ajax成功回调中进行处理呢。我可能会误解，但所有浏览器的惯例是
innerHTML
都是阻塞的；只有将其中的所有内容添加到dom中，它才会返回，因此dom返回时实际上已准备就绪。@AlexK。也许你是对的，我的示例不是我用来使理解问题更简单的实际代码，但我将修改我的示例。感谢你的回答，
instance.success
在服务器响应后启动，然后我可以将响应作为字符串处理。当我将框附加到文档体时，框的innerHTML中有一些部分在附加到dom时没有加载，这些部分是图像、脚本、样式表等，因此我不能只在
appendChild
之后调用函数，尤其是在我的项目中，我需要处理图像，例如，图像的宽度和高度在完全加载之前是不可读的，但是，如果您在对象（如json）中有这些值，那么它应该会按预期工作，并进行更多的工作感谢您的回答，
instance.success
会在服务器以响应进行响应后触发，然后我可以将响应作为字符串进行处理。当我将框附加到文档体时，框的innerHTML中有一些部分在附加到dom时没有加载，这些部分是图像、脚本、样式表等，因此我不能只在
appendChild
之后调用函数，尤其是在我的项目中，我需要处理图像，例如，图像的宽度和高度在完全加载之前是不可读的，但假设您在json之类的对象中有这些值，那么它应该会像预期的那样工作，再多做一点工作您是对的，但我已经在oth中解决了我的问题
var script = document.createElement('script');
script.type = 'text/javascript';
script.innerHTML = 'alert(\'loaded\')';
document.getElementById('photo-box').appendChild(script);