Это ваш не работает, а это будет работать
<html>
<body>
<section id="user-greeting">
<label>
Имя
<input type="text" autocomplete="name" required>
</label>
<label>
Фамилия
<input type="text" autocomplete="family" required>
</label>
<button name="mem">Запомнить</button>
<section>
Привет, <span class="name"></span> <span class="family"></span>, добро пожаловать на сайт!
<button name="del">Забудь обо мне!</button>
</section>
</section>
<script>
document.querySelectorAll("button").forEach((b) => {
b.addEventListener("click", (b) => {
if(b.target.name=='set') {
var err = false, mem = [];
document.querySelectorAll("#user-greeting [required]").forEach(function(f) {
if(!f.value.trim()) {
err = true;
alert('Не заполнено!');
} else mem.push(f.value); //запомнить ввод
});
if(!err) { //поля заполнены
alert('Запомнить '+mem.join(' '))
}
} else delete localStorage.name; //удалить запомненное
});
})
</script>
</body>
</html>
Что-то в песочнице не работает, но запустите это отдельной страницей, и будут сообщения если поля будут пусты или содержать одни пробелы. А уж по каким правилам проверять, это уже не мне решать, тем более, что по логике все это похоже на бред.