Question

我有一个javascript函数，它对API进行外部调用，然后API会将一些HTML注入我的页面。

现在我想执行一个检查此脚本的函数，如果它没有将HTML注入我的页面，我想在这里做一些其他事情。问题是我无法在Ctrl+Alt+Space和document.ready上调用此函数，因为在这两个事件之后，外部API的第一个脚本会被执行。

脚本如下所示：

window.load

现在我写的函数如下：

(function () {
    var o = ccs_cc_args; o.push(['_SKey', '35455c2f']); o.push(['_ZoneId', '311e740881']);
    var sc = document.createElement('script'); sc.type = 'text/javascript'; sc.async = true;
    sc.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'cdn.cnetcontent.com/jsc/h.js';
    var n = document.getElementsByTagName('script')[0]; n.parentNode.insertBefore(sc, n);
})();

所以我需要强制第二个函数在第一个没有发生的脚本之后运行。

Answer 1

根据spec，执行脚本后，浏览器必须

  名为afterscriptexecute的{li>
Fire a simple event在script元素处冒泡（但不可取消）。


如果脚本来自外部文件fire a simple event，则script元素为queue a task。

否则，脚本是内部的; <{3}} fire a simple event script load load元素{/ 3}}

因此，您可以向load元素添加afterscript或script事件监听器：

scriptElement.addEventListener('load', callback);

如果您没有对script元素的引用，则可以使用事件委派并将事件侦听器添加到祖先，例如document。

请注意，此功能仅适用于afterscriptexecute，其中包含load，但不包括script。

另请注意，事件侦听器可能会运行多个document.addEventListener('afterscriptexecute', function(e) { if(e.target.src === url) callback(); });元素，因此您可能必须过滤所需的元素。

afterscriptexecute

您还可以在捕获阶段使用事件委派。然后load和document.addEventListener('load', function(e) { if(e.target.tagName.toLowerCase() == 'script' && e.target.src === url) callback(); }, true);都可以工作，并且其他一些侦听器停止传播事件的机会（这将避免执行回调）将会更低。

// ...

$id = (array)$this->_newId($primary) + $keys;
$primary = array_combine($primary, $id);
$filteredKeys = array_filter($primary, 'strlen');
$data = $filteredKeys + $data;

// ...

$statement = $this->query()->insert(array_keys($data))
  ->values($data)
  ->execute();

// ...

如何在执行所有javascript后调用函数

1 个答案: