错误的状态:没有元素

// 错误的示例
let element = document.getElementById('nonExistentId'); // 这将返回null

// 正确的示例
let element = document.getElementById('existingId');
if (element) {
    // 元素存在，可以进行操作
} else {
    console.error('元素不存在');
}

document.addEventListener('DOMContentLoaded', function() {
    let element = document.getElementById('existingId');
    if (element) {
        // 元素存在，可以进行操作
    } else {
        console.error('元素不存在');
    }
});

function createElement() {
    let newElement = document.createElement('div');
    newElement.id = 'dynamicElement';
    document.body.appendChild(newElement);
}

createElement();

// 确保在元素创建后再访问
setTimeout(() => {
    let element = document.getElementById('dynamicElement');
    if (element) {
        // 元素存在，可以进行操作
    } else {
        console.error('元素不存在');
    }
}, 0);

function renderElement(condition) {
    if (condition) {
        let element = document.createElement('div');
        element.id = 'conditionalElement';
        document.body.appendChild(element);
    }
}

renderElement(true);

// 确保在条件满足后再访问
setTimeout(() => {
    let element = document.getElementById('conditionalElement');
    if (element) {
        // 元素存在，可以进行操作
    } else {
        console.error('元素不存在');
    }
}, 0);