Javascript 在DOM树中完全呈现内部html后,将触发哪个事件?
我想知道当任何div的innerHtml属性被更改并且该div的DOM树被完全加载到内存中时,将触发什么事件 我想在触发该事件后调用以下函数。我想删除下面函数中的setTimeout hack,因为它有时可能会失败Javascript 在DOM树中完全呈现内部html后,将触发哪个事件?,javascript,jquery,html,angularjs,angular,Javascript,Jquery,Html,Angularjs,Angular,我想知道当任何div的innerHtml属性被更改并且该div的DOM树被完全加载到内存中时,将触发什么事件 我想在触发该事件后调用以下函数。我想删除下面函数中的setTimeout hack,因为它有时可能会失败 private registerEventListenersForLink() { let _self = this; setTimeout(function () { var AElemList = document.querySelectorAll('.appme
private registerEventListenersForLink() {
let _self = this;
setTimeout(function () {
var AElemList = document.querySelectorAll('.appmedia-content-wrapper a');
for (let i = 0; i < AElemList.length; i++) {
AElemList[i].addEventListener("click", function (event) {
event.preventDefault();
event.stopPropagation();
var url = event.target["href"];
if (url && url.trim() != '') {
_self.utilService.openUrlExternaly(url);
}
});
}
}, 80);
}
我发现了与上述问题相关的以下链接,但我没有任何想法:
我解决了我的问题。我已经执行了一项如下的指令,它起到了很好的作用。感谢Rory McCrossan为我介绍MutationObserver api
import { Directive, ElementRef } from '@angular/core';
import { UtilService } from '../../providers/util-service';
@Directive({
selector: '[external-links]' // Attribute selector
})
export class ExternalLinks {
private observer;
constructor(private elRef: ElementRef, public utilService: UtilService) {
}
ngAfterViewInit() {
var _self = this;
this.observer = new MutationObserver(mutations => {
mutations.forEach(function (mutation) {
if (mutation.type == 'childList') {
var AElemList = _self.elRef.nativeElement.querySelectorAll('a');
for (let i = 0; i < AElemList.length; i++) {
AElemList[i].addEventListener("click", function (event) {
event.preventDefault();
event.stopPropagation();
var url = event.target["href"];
if (url && url.trim() != '') {
_self.utilService.openUrlExternaly(url);
}
});
}
}
});
});
var config = { childList: true };
this.observer.observe(this.elRef.nativeElement, config);
}
}
为什么要用and标记它?听起来像是需要一个而不是一个事件处理程序;我同意@Rorymcrossan,但我希望这段代码在android Webview中起作用,因为我正在开发一个跨平台的移动应用程序。如何使用MutationObserver使代码在旧浏览器中兼容?如果您需要旧浏览器支持,那么MutationObserver将无法正常工作。您的替代方案是不断地轮询DOM,这是您当前正在做的事情,这很难看,可能会导致速度减慢。或者,您可以在元素更改时手动引发事件,但这只有在您控制了代码库的情况下才能起作用。如果是第三方库添加内容,则无法执行此操作,第一种方法是您可以使用的所有方法