// 创建元素
const newElement = document.createElement('div');
newElement.textContent = '点击我';

// 绑定事件
newElement.addEventListener('click', function() {
    console.log('元素被点击了');
});

// 添加到DOM
document.body.appendChild(newElement);

const observer = new MutationObserver(function(mutations) {
    mutations.forEach(function(mutation) {
        Array.from(mutation.addedNodes).forEach(function(node) {
            if (node.nodeType === 1 && node.matches('.my-element')) { // 检查是否是元素节点且有特定类
                console.log('元素已添加到DOM:', node);
                // 在这里执行你的就绪逻辑
            }
        });
    });
});

observer.observe(document.body, {
    childList: true,
    subtree: true
});

// 创建并添加元素
const element = document.createElement('div');
element.className = 'my-element';
document.body.appendChild(element);

function waitForElement(selector) {
    return new Promise(resolve => {
        if (document.querySelector(selector)) {
            return resolve(document.querySelector(selector));
        }

        const observer = new MutationObserver(() => {
            if (document.querySelector(selector)) {
                observer.disconnect();
                resolve(document.querySelector(selector));
            }
        });

        observer.observe(document.body, {
            childList: true,
            subtree: true
        });
    });
}

// 使用示例
waitForElement('#myElement').then(element => {
    console.log('元素已就绪:', element);
    // 在这里绑定事件或执行其他操作
    element.addEventListener('click', () => {
        console.log('元素被点击');
    });
});

document.addEventListener('click', function(event) {
    if (event.target.matches('.dynamic-element')) {
        console.log('动态元素被点击:', event.target);
    }
});