Dom exercise

[EstefaSora125]

Dom exercise by Estefanía Sora

[pushdev-code]

you can save the form reference so you get the elements faster. It is also better to use const since these values will never change. Grouping multiple variable definitions is not easy to read, so it's better if you keep them separated.

Suggested change

	let name = document.querySelector('#contact_form').querySelector('#user_name'),
	email = document.querySelector('#contact_form').querySelector('#email_this'),
	number = document.querySelector('#contact_form').querySelector('#user_phone_number'),
	textBox = document.querySelector('#contact_form').querySelector('#text-box'),
	box = document.querySelector('#contact_form').querySelectorAll('input[type="checkbox"]');
	const form = document.querySelector('#contact_form');
	const name = form.querySelector('#user_name');
	const email = form.querySelector('#email_this');
	const number = form.querySelector('#user_phone_number');
	const textBox = form.querySelector('#text-box');
	const box = form.querySelectorAll('input[type="checkbox"]');

[pushdev-code]

Suggested change

	validateChecBox(box);
	validateCheckBox(box);

[pushdev-code]

you don't need to do this, in Javascript you can use objects as dictionaries:

let formValues = {
  name:  'name',
   email:  'email'
};
// and then you can access these key/pair values

for (const property in formValues) {
  console.log(`${property}: ${formValues[property]}`);
}

In this way you don't need to do a double for loop which is performance heavy.

[pushdev-code]

for some reason this validation is being executed twice and then a double alert is being displayed to the user, can you double check.

[pushdev-code]

Suggested change

	function showInfotmation(label, text=[]){
	function showInformation(label, text=[]){

[pushdev-code]

Suggested change

	<label for="email_this">E-mail address
	<input id="email_this" name="Email" aria-required="true" >
	<label for="email">E-mail address
	<input id="email" name="Email" aria-required="true" >

[pushdev-code]

Suggested change

	<div id="course" >
	<div id="course">

[pushdev-code]

Suggested change

	<div>
	<textarea name="message" id="text-box" cols="40" rows="10"></textarea>
	</div>
	<textarea name="message" id="text-box" cols="40" rows="10"></textarea>

[pushdev-code]

Suggested change

	<button>Send mesagge</button>
	<button>Send message</button>

[pushdev-code]

Suggested change

	<p>This example was created <time datetime="2020-04-12 11:21">at 11:21 AM</time></p>
	<p>This example was created at<time datetime="2020-04-12 11:21">11:21 AM</time></p>