如何使用Vanilla JavaScript验证表单

我是JS的新手，我需要一些有关表单验证的帮助。我有两个功能：一个用于表单验证，另一个用于更改提交页面上的信息。而且我不知道如何使它们一起工作。验证的工作原理，但是我可以使用无效的输入提交表单。

这是验证代码：

    const setEventListeners = (formElement) => {
      const inputList = Array.from(formElement.querySelectorAll(`.popup__input`));
      const buttonElement = formElement.querySelector('.popup__button_submit');
      inputList.forEach((inputElement) => {
        inputElement.addEventListener('input', () => {
          checkInputValidity(formElement, inputElement);
          toggleButtonState(inputList, buttonElement);
        });
      });
    };

    const enableValidation = (formElement, submitHandler) => {
      formElement.addEventListener('submit', (evt) => {
        evt.preventDefault();
        submitHandler();
      });
      setEventListeners(formElement);
    }

这应该在页面上发生：

    const userContainer = document.querySelector('#user-container');
    const userName = document.querySelector('#user-name');
    const userInfo = document.querySelector('#user-info');
    function submitUserForm() {
        profileName.textContent = userName.value;
        profileAbout.textContent = userInfo.value;
        toggleModalWindow(userForm);
    }

    enableValidation(userContainer, submitUserForm);
    ```