JavaScript监听DOM元素内容加载完毕 - MutationObserver使用指南

在JavaScript中，可以使用MutationObserver来监听DOM元素的变化，从而判断内容是否加载完毕。

首先，需要创建一个MutationObserver实例，并指定回调函数。回调函数会在指定的DOM元素或其子元素发生变化时被触发。

接下来，可以使用querySelector或querySelectorAll函数来获取要监听的DOM元素。在本例中，可以使用以下代码获取到class为'ec-box player-list ec-show'的元素：

var targetNode = document.querySelector('.ec-box.player-list.ec-show');

然后，可以开始监听该DOM元素的变化。在回调函数中，可以判断DOM元素的内容是否加载完毕。

var observer = new MutationObserver(function(mutationsList) {
    for(var mutation of mutationsList) {
        if (mutation.type === 'childList' && mutation.addedNodes.length > 0) {
            // 判断内容是否加载完毕
            if (mutation.target.innerHTML !== '') {
                console.log('内容加载完毕');
                // 执行相应的操作
            }
        }
    }
});

observer.observe(targetNode, { childList: true });

上述代码中，我们在MutationObserver的回调函数中，判断当添加的子节点数量大于0并且目标元素的innerHTML不为空时，即可认为内容加载完毕。你可以根据实际需求修改判断条件。

最后，调用observer.observe(targetNode, { childList: true });来开始监听DOM元素的变化。

请注意，MutationObserver在监听DOM变化时是异步的，所以可能需要等待一段时间来确保内容已经加载完毕。