特定的Javascript函数给出未捕获的类型错误，其他函数正常工作

Question

我有一堆javascript检查某些字段的内容，如果它们为空或不符合特定条件则返回false。这是一个工作函数的例子。

if(!medicalform.surname.value.length){
valid=false;
 document.getElementById('surname-required').style.display = "inline-block";
 document.getElementById('surname').focus();
}

所以我有这部分javascript：

if (!medicalform.dob.value.length) {
valid=false;
document.getElementById('dob-required').style.display = "inline-block";
document.getElementById('dob').focus();
}

if (!medicalform.cob.value.length) {
valid=false;
document.getElementById('cob-required').style.display = "inline-block";
document.getElementById('cob').focus();
}

分别读取日期字段和国家/地区字段的长度，如果它们没有长度，则会将变量valid更改为false，突出显示并显示一条span消息，告诉填写表单的人填写它in，并将false返回到完全填充的表单。

但是，在运行脚本时，它会显示

Uncaught TypeError: Cannot read property 'style' of null

我已分别附加了html的dob和cob部分。

出生日期：<input type="date" id="dob" name="dob" min="1900-01-01"> <span class="error-messages" id="dob-required"> Please enter your date of birth. </span>

出生国家： <select name="country" id="cob" name="cob" onChange="dropDownList(this);"> <span class="error-messages" id="cob-requried"> Please enter your country of birth </span>

可能出现什么问题？该错误指向dob javascript的style.display。