Question

我收到此错误“无法读取null的属性'0'。”

我有一张表

somename.html

<table>  
    <tr>  
    <td id="td1">text</td>  
    </tr>  
    </table>

somename.js

function test(){  
    var date=new Date();  
    if(date.getDay()==1 && date.getHours() >=13  && date.getMinutes() >=3 ){ //8-9AM  
        document.getElementById('td1')[0].style.color = 'blue';  
    }else if(date.getDay()==1 && date.getHours() == 14  && date.getMinutes() <= 20){  
            document.getElementById('td1')[0].style.color = 'blue';  
    }else{  
      //nothing  
    }  
}  
setInterval(test(),1000);

编辑：如果我删除[0]则新错误“无法读取属性'样式'为空”

Answer 1

如果文档中没有匹配项，则

getElementById会返回null。（这会导致您的错误消息）。

这意味着要么你的选择器中有拼写错误，要么在你的元素被包含在dom中之前执行html或js。

此外，getElementById返回单个元素而不是数组（确切地说Node List），因此正确的调用将是：

document.getElementById('td1').style.color = 'blue';

第三个问题：

setInterval(test(),1000);
//              /\
// this will immeditately execute the function and
// hands over the *return value* to setInterval

不会按预期工作，需要

setInterval(test,1000);
//            /\
// hand over the *function reference* to be executed after 1 second

Answer 2

document.getElementById('td1')返回元素，而不是数组。删除[0]。

您还可以在尝试使用之前检查元素是否存在：

function test() {  
    var elem = document.getElementById('td1');
    if(typeof elem == 'undefined') return;

    var date = new Date();
    if(date.getDay()==1 && date.getHours() >=13  && date.getMinutes() >=3 ) { //8-9AM  
        elem.style.color = 'blue';  
    } else if(date.getDay()==1 && date.getHours() == 14  && date.getMinutes() <= 20) {  
        elem.style.color = 'blue';  
    } else {  
      //nothing  
    }  
}  
setInterval(test, 1000);

Answer 3

如果您的id是唯一的，那么这将有效

document.getElementById('td1').style.color = 'blue';

Answer 4

当您致电setInterval时，您必须提供一项功能。您正在立即调用该函数，而不是将函数传递给setInterval。它应该是：

setInterval(test, 1000);

由于您正在立即调用它，因此它在DOM完全加载之前运行，并且找不到td1元素。因此getElementById会返回null而不是元素。

此外，正如其他答案所指出的那样，您不应使用[0]来访问getElementById返回的元素。它返回单个元素，而不是NodeList。

无法读取属性* 0 *的null

4 个答案: