Author: John Au-Yeung

Sometimes, we want to validate that a password is at least 6 character long with JavaScript.

In this article, we’ll look at how to validate that a password is at least 6 character long with JavaScript.

How to validate that a password is at least 6 character long with JavaScript?

To validate that a password is at least 6 character long with JavaScript, we can check if the length property of the input value string is at least 6.

For instance, we write:

<input type='password' />

to add a password input.

Then we write:

const input = document.querySelector('input')
input.onchange = (e) => {
  if (e.target.value.length >= 6) {
    console.log('valid')
  }
}

We select the input with querySelector.

Then we set the input.onchange property to a function that checks if e.target.value.length is bigger than or equal to 6.

e.target.value is the input value.

If e.target.value.length is bigger than or equal to 6, then the password is valid.

Conclusion

To validate that a password is at least 6 character long with JavaScript, we can check if the length property of the input value string is at least 6.

Sometimes, we want to determine the day of the week with JavaScript.

In this article, we’ll look at how to determine the day of the week with JavaScript.

How to determine the day of the week with JavaScript?

To determine the day of the week with JavaScript, we can call the JavaScript date’s getDay method.

We can also use toLocaleString to return date as a human readable string.

For instance, we write:

const d = new Date(2022, 1, 1).getDay();
console.log(d)

We call getDay on the Date instance to return the day of the week as a number.

It ranges from 0 to 6, where 0 is Sunday and 6 is Saturday.

Therefore, since Feb 1, 2022 is a Tuesday, we get 2 for the value of d.

To use toLocateString we write:

const d = new Date(2022, 1, 1).toLocaleDateString('en', {
  weekday: 'long'
})
console.log(d)

We call toLocaleString with the locale and object with the weekday property to return the day of the week.

Therefore, we get 'Tuesday' as the value of d.

Conclusion

To determine the day of the week with JavaScript, we can call the JavaScript date’s getDay method.

Sometimes, we want to handle Tab Key presses with JavaScript.

In this article, we’ll look at how to handle Tab Key presses with JavaScript.

How to handle Tab Key presses with JavaScript?

To handle Tab Key presses with JavaScript, we can listen for the keyup event.

For instance, we write:

<input /><input />

to add 2 input elements.

Then we write:

document.onkeyup = (e) => {
  if (e.keyCode === 9) {
    console.log("tab pressed");
  }
}

to listen to the keyup event emitted by anything on the page.

We check if the tab key is pressed by checking if e.keyCode returns 9.

Therefore, when we press tab to jump between the 2 inputs, we see 'tab pressed' logged.

Conclusion

To handle Tab Key presses with JavaScript, we can listen for the keyup event.

Sometimes, we want to add text into span after calling document.createElement("span") with JavaScript.

In this article, we’ll look at how to add text into span after calling document.createElement("span") with JavaScript.

How to add text into span after calling document.createElement("span") with JavaScript?

To add text into span after calling document.createElement("span"), we can set the textContent property of the span element to the text we want to see.

For instance, we write:

const closeSpan = document.createElement("span");
closeSpan.textContent = "Close";
document.body.appendChild(closeSpan)

We create the span with:

const closeSpan = document.createElement("span");

Then we set the text content of the span with:

closeSpan.textContent = "Close";

Finally, we attach the span to the body as its child with:

document.body.appendChild(closeSpan)

Conclusion

To add text into span after calling document.createElement("span"), we can set the textContent property of the span element to the text we want to see.