Author: John Au-Yeung

Sometimes, we want to convert hours and minutes to minutes with moment.js.

In this article, we’ll look at how to convert hours and minutes to minutes with moment.js.

How to convert hours and minutes to minutes with moment.js?

To convert hours and minutes to minutes with moment.js, we can use the duration and asMinutes methods.

For instance, we write:

const m = moment.duration(moment('10:10:10', 'HH:mm:ss').format("HH:mm")).asMinutes()
console.log(m)

We call moment.duration with a moment object formatted in HH:mm format to get the duration object.

Then we convert the duration to an object with the asMinutes methods.

Therefore, we get 610 as a the value of m.

Conclusion

To convert hours and minutes to minutes with moment.js, we can use the duration and asMinutes methods.

Sometimes, we want to find DOM elements with CSS selectors with JavaScript.

In this article, we’ll look at how to find DOM elements with CSS selectors with JavaScript.

How to find DOM elements with CSS selectors with JavaScript?

To find DOM elements with CSS selectors with JavaScript, we can use the querySelectorAll method.

For instance, we write:

<table>
  <tbody>
    <tr>
      <td></td>
      <td></td>
    </tr>
  </tbody>
</table>

to add the table with some td elements.

Then we can select the 2nd td by writing:

const cells = document.querySelectorAll("table > tbody > tr > td:nth-of-type(2)");
console.log(cells)

with querySelectorAll.

Therefore, cells is a node list object with the 2nd td inside.

Conclusion

To find DOM elements with CSS selectors with JavaScript, we can use the querySelectorAll method.

Sometimes, we want to join relative URLs in JavaScript.

In this article, we’ll look at how to join relative URLs in JavaScript.

How to join relative URLs in JavaScript?

To join relative URLs in JavaScript, we can use the URL constructor.

For instance, we write:

const {
  href
} = new URL('../../address', 'http://www.example.com/more/evenmore/')
console.log(href)

We use the URL constructor to combine the relative URL with the base URL.

We then get the combined URL from the href property.

Therefore, href is 'http://www.example.com/address'.

Conclusion

To join relative URLs in JavaScript, we can use the URL constructor.

Sometimes, we want to trigger an event when the user clear a textbox with JavaScript.

In this article, we’ll look at how to trigger an event when the user clear a textbox with JavaScript.

How to trigger an event when the user clear a textbox with JavaScript?

To trigger an event when the user clear a textbox with JavaScript, we can listen to the input’s keyup event.

For instance, we write:

<input>

to add an input.

Then we write:

const input = document.querySelector('input')
input.onkeyup = () => {
  if (!input.value) {
    console.log('cleared');
  }
}

to select the input with querySelector.

Then we set the input.onkeyup property to a function that check if input.value is an empty string.

If it is, then 'cleared' is logged.

Therefore, when the input is cleared with backspace, we see 'cleared' logged.

Conclusion

To trigger an event when the user clear a textbox with JavaScript, we can listen to the input’s keyup event.

Sometimes, we want to remove element from array using slice with JavaScript.

In this article, we’ll look at how to remove element from array using slice with JavaScript.

How to remove element from array using slice with JavaScript?

To remove element from array using slice with JavaScript, we can get the index of the element we want to remove, then we can call slice and use the spread operator to create a new array without the element we remove.

For instance, we write:

const items = ['foo', 'bar', 'baz', 'qux']
const index = 1
const arr = [...items.slice(0, index), ...items.slice(index + 1)]
console.log(arr)

We have items.slice(0, index) to return an items array items from index 0 to index - 1.

And we have items.slice(index + 1) to return the items array from index index + 1 to the end of the array.

Next, we spread both arrays into a new array and assign it to arr.

Therefore, arr is ['foo', 'baz', 'qux'].

Conclusion

To remove element from array using slice with JavaScript, we can get the index of the element we want to remove, then we can call slice and use the spread operator to create a new array without the element we remove.