Javascript 当元素根本不出现在页面上时，检查元素的可见性

原谅我的天真。我是一名网络分析师，对Javascript不太在行。但是，我正在稳步地学习（我想）。Javascript是一种迷人的语言。因此，以下代码块仅在用户触发验证错误时出现

<span class="field-validation-error" data-valmsg-for="sisiconfirmemail" data-valmsg-replace="true">
   <span id="sisiconfirmemail-error" class="">The confirmation address and e-mail address must 
   match</span>
</span>

---

您可以使用GetElementsByCassName（类）方法来获取与类匹配的元素的HTMLCollection。如果它的长度等于零，就没有了

下面是一个例子：

if（document.getElementsByClassName（“字段验证有效”）.length>0）{
console.log（“字段验证有效存在”）；
}

问题2答案：

您可以使用以下命令检查元素是否存在

if(document.querySelector('#sisiconfirmemail-error'))

---

您不需要检查元素的任何属性，只需通过

document.querySelector（）

检查返回的结果是否为

null

if（document.querySelector（'.field validation error'））{
log（'element exist'）；
}
否则{
log（'元素不存在'）；
}

必须提供确认地址和电子邮件地址
比赛

您可以建立一个检查，使您能够根据页面上是否有元素返回

true

或

false

。查看下面的函数，它根据您的查询查找元素

const elementExists = selector => document.querySelector(selector) !== null;

您可以检查错误和有效消息是否都在文档中，或者任何其他元素中

const hasErroMessage = elementExists('.field-validation-error');
const hasValidMessage = elementExists('.field-validation-valid');

---

但是，这并不检查元素是否可见。

您需要记住，不可见的元素并不意味着它不存在。因此，我过度思考使我的生活变得困难。Cheers@Greconomist是的，有点，这也是学习的一部分：）

const elementExists = selector => document.querySelector(selector) !== null;

const hasErroMessage = elementExists('.field-validation-error');
const hasValidMessage = elementExists('.field-validation-valid');