在没有回调函数的情况下更改jQuery中的动态内容

Question

我一直在寻找一个很好的答案很长一段时间，似乎无法就一个简单的方法找到共识。似乎许多以前的方式也被弃用了。

基本上使用HubSpot平台我正在创建一个自定义页面。该页面有一个动态添加的部分。由于没有我可以使用的回调函数，而.load（）或.ready（）似乎不适用于动态内容。我怎样才能抓住这些需要几秒钟加载的DOM元素？

Answer 1

.load和.ready等待DOM加载。这将是服务器的原始html输出，这意味着任何动态加载的内容都不会存在，因此无法操作。

最简单的方法是使用JQuery .ajaxComplete()并将其附加到文档中。

基本上，它会变成：

$(document).ajaxComplete(function() { /* Do Stuff */ });

缺点是，当任何ajax调用完成时，这将会触发，而不仅仅是你正在调用的那个，如果它是一个缓慢处理函数，它将导致你的页面相当滞后。

最好的办法是将其与条件语句一起使用，以查看是否已加载要操作的数据。例如。如果要在加载后修改类为“foo”的元素，可以执行以下操作：

$(document).ajaxComplete(function() { if($('.foo').length) { /* Element exists since length is greater than 0, do stuff */ });

它仍然会触发每个ajax调用，但至少这样会导致页面滞后太多，因为条件语句将失败直到文档加载。

此外，根据您要对元素执行的操作，您可能需要添加一些检查是否已处理的方法（例如，通过创建布尔变量，在查看元素是否存在时检查值，然后一旦你做了修改就改变它。）