未捕获的TypeError:尝试更改给定元素的样式时,无法读取未定义的属性"样式"

Question

我尝试学习javascript和ajax,所以我写任何脚本,我想在表单中更改给定元素的样式.我试图这样做2天但没有任何影响 - 我仍然有错误"Uncaught TypeError:无法读取未定义的属性'样式'".我在下面包含我的html和js代码.请告诉我我做错了什么:

HTML:

<div id="registerNewUser" class="tabContent">
                  <h1>Registration form</h1>
                  <form action='#' name='registerForm' id='registerForm'> 
                    <table style='width: 25%;'>
                        <tr>
                            <td>Name:</td><td><input type="text" style="border: 1px solid #000;" id='name' name='name' size ="10" onClick='changeStyle(this.id);' onBlur='checkFieldName();'></td>
                            <td><div id='divName'></div></td>
                        </tr>
                        <tr>
                            <td>Second Name:</td><td><input type="text" style="border: 1px solid #000;" id='secondName' name='secondName' size="10" onClick='changeStyle(this.id);' onBlur='checkFieldSecondName();'></td>
                            <td><div id='divSecondName'></div></td>
                        </tr>
                        <tr>
                            <td>Password:<sup style='cursor: help' title="Password must have at least 6 characters">*</sup></td><td><input type="password" style="border: 1px solid #000;" id='password' name='password' size="10" onClick='changeStyle(this.id);' onBlur='checkFieldPassword();'></td>
                            <td><div id='divPassword'></div></td>
                        </tr>
                        <tr>
                            <td>Retype Password:<sup style=' cursor: help' title="Password must have at least 6 characters">*</sup></td><td><input type="password" style="border: 1px solid #000;" name="retypePassword" id='retypePassword' size="10" onClick='changeStyle(this.id);' onBlur='checkFieldRetypePassword();'></td>
                            <td><div id='divRetypePassword'></div></td>
                        </tr>
                        <tr>
                            <td>Email:</td><td><input type="text" style="border: 1px solid #000;" id='email' name='email' size="10" onClick='changeStyle(this.id);' onBlur='checkFieldEmail();'></td>
                            <td><div id='divEmail'></div></td>
                        </tr>
                    </table>
                  </form>
              </div>

JavaScript的:

var registerForm=document.getElementById('registerForm'); // register form

function changeStyle(element)
{
    registerForm.element.style.border='1px solid #fff';
}

提前致谢.

Answer 1

您需要按ID获取元素:

document.getElementById(element).style.border = '1px solid #fff';