Question

我有一系列可点击的项目。每个页面根据用户选择的内容生成新项目。我希望能够根据特定ID是否存在来运行一些代码，如果它不存在，我不希望它运行。这是我到目前为止所尝试的：

function pageLoad() {
    var ums = document.getElementById('DIVID').innerHTML;
    if(ums == "IN (INCHES)") {
        allFunctionsInvoked();
        }   
}

当元素不存在时，我收到此错误消息：

Uncaught TypeError: Cannot read property 'innerHTML' of null

导致我的程序冻结。我已经尝试添加一个else if语句来检查ID是否为null，但仍然无法解决它。

Answer 1

如果具有指定ID的元素不在文档中，.getElementById() method将返回null。

因此，在检索null属性之前，您可以检查元素是否不是innerHTML：

function pageLoad() {
    var element = document.getElementById('DIVID');

    if (element !== null && element.innerHTML == "IN (INCHES)") {
        allFunctionsInvoked();
    }   
}

作为旁注，如果您只是检查一串文字，则可以访问textContent property而不是innerHTML属性：

function pageLoad() {
    var element = document.getElementById('DIVID');

    if (element !== null && element.textContent === "IN (INCHES)") {
        allFunctionsInvoked();
    }   
}

Answer 2

您可以将此值检查为null：

function pageLoad() {
    var elem = document.getElementById('DIVID');

    if (elem === null) {
        console.log("No DIVID element.");
        return;
    }

    if (elem.innerHTML == "IN (INCHES)") {
        allFunctionsInvoked();
    }   
}

也可以简单地使用!elem，因为null falsy ：

function pageLoad() {
    var elem = document.getElementById('DIVID');

    if (!elem) {
        console.log("No DIVID element.");
        return;
    }

    if (elem.innerHTML == "IN (INCHES)") {
        allFunctionsInvoked();
    }   
}

Else-if元素ID不存在

2 个答案: