Javascript 样式验证

我想知道是否有可能将以下css转换为javascript？所以基本上，它应该在onchange之后实现样式规则

.appnitro input:required:valid, .appnitro textarea:required:valid {/* when a field is considered valid by the browser */
box-shadow: 0 0 5px #5cd053;
border-color: #28921f;
}


.appnitro input:focus:invalid, .appnitro textarea:focus:invalid { /* when a field is considere invalid by the browser */
box-shadow: 0 0 5px #5d45252;
border-color: #b03535;
}


<script>
function myFunction(){
??????
}
</script>


<form id="form_664184" class="appnitro"  method="post" action="">
    <input type="text" id="element_3"  name="element_2_1" value="Title" onchange="myFunction()" required />
</form>

.appnitro输入：必需：有效，.appnitro文本区域：必需：有效{/*当浏览器认为某个字段有效时*/
盒影：0 0 5px#5cd053；
边框颜色：#28921f；
}
.appnitro输入：焦点：无效，.appnitro文本区域：焦点：无效{/*当浏览器认为某个字段无效时*/
盒影：0 0 5px#5d4552；
边框颜色：#b03535；
}
函数myFunction（）{
??????
}

是的，是的。以下是它应该是什么样子：

yourElement.style.borderColor =  "#5cd053";
yourElement.style.boxShadow = "#5cd053";

---

通过ID、类名或其他任何方式获取元素。

查看从HTMLStyleElement

或

文档项的属性表中获取的元素的DOM接口。样式表

。使用此选项是可以的，但没有意义，因为没有使用input:focus:valid和input:focus:invalid，它会简单地将边框和阴影设置为默认颜色。您已经非常接近了，但我需要了解如何使无效/有效位工作。